Javascript 如何检查数组中的每个项目？

我有一个对象数组，并在输入中渲染其中的每一项，在这一部分下，我有一个按钮来做一些事情

我想检查每一项“输入”，如果它是空的，不要调用按下按钮的函数

我的代码适用于第一个对象并非所有对象

陈述

这是我的iterable数组

renderToolsUsed = () => {
    const {toolsUsed} = this.state;

    return toolsUsed.map(({name, id, price, count}, i) => {
      console.log('i', i);
      if (
        toolsUsed[i].name.length > 0 &&
        toolsUsed[i].price.length > 0 &&
        toolsUsed[i].count.length > 0
      ) {
        this.setState({valid: true});
      }

      return(
         <View>.....</View>
      )
    }

编辑

对于答案@SLePort

renderToolsUsed = () => {
    const {toolsUsed} = this.state;

    return toolsUsed.map((item, i) => {
      console.log(item);
      this.setState(
        {
          // ...item,
          isValid: ['name', 'price', 'count'].every(
            key => item[key].length > 0,
          ),
        },
        () => console.log('isValid', this.state.isValid),
      );

       return (
        <View key={i} style={styles.tools}>
             <Text>{item.name}</Text>
             ...
        </View>
       );
      });
  };

renderToolsUsed=（）=>{
const{toolsUsed}=this.state；
返回工具使用的.map（（项目，i）=>{
控制台日志（项目）；
这是我的国家(
{
//…项目，
有效：['name'、'price'、'count']。每(
key=>项[key]。长度>0，
),
},
（）=>console.log（'isValid'，this.state.isValid），
);
返回(
{item.name}
...
);
});
};

按照您的操作方式，它只为第一项设置状态， 调用

setState

后，它会触发重新渲染，这可能是您面临的问题 可能是

数组。reduce

将帮助您

试试这个

 const isValid =  toolsUsed.reduce((acc, curr) => {
  if(curr.name.length && curr.price.length && curr.count.length) {
     return true
   }
   return false
   }, false
   )
this.setState({isValid })

如果您有任何代码沙盒示例，请与他人分享，以便优化功能，请注意减少功能的第二个参数将是累加器的初始值

acc

，可能您必须调整它以使实际功能正常工作

---

如果要检查的每个属性都有

长度>0

，请随时提问您可以循环项目并添加

isValid

键

const toolsUsed = [
  {
    id: 0,
    name: 'first',
    price: '2',
    count: '4',
  },
  {
    id: 1,
    name: 'second',
    price: 1,
    count: 8,
  },
]

const validToolsUsed = toolsUsed.map(item => ({
    ...item, 
    isValid: ['name', 'price', 'count']
      .every(key => item[key].length > 0 )
  })
)

---

你想在

setState

中添加它吗？在

setState

中添加它很好，但是你能解释一下吗，

…项，

什么意思，我们为什么要这样做？和

项[键]

？因为当我记录

item[key]

时，它返回未定义

…item

在添加

isValid

属性之前，使用语法展开对象的所有条目。

键

指的是

['name'、'price'、'count']

中的每个键，即您要检查其值的属性。但我的意思是，为什么要在

[]

~

中的
项[key]
~中添加
键

callback

item

和

key

都是指数组中正在处理的当前值。它们只是在回调中使用，与您的状态无关。在

[1,2].map（e=>e*2）

中，

e

只是将在数组的每个项上使用以生成

[2,4]

的变量。更多信息，请参阅。

 const isValid =  toolsUsed.reduce((acc, curr) => {
  if(curr.name.length && curr.price.length && curr.count.length) {
     return true
   }
   return false
   }, false
   )
this.setState({isValid })

const toolsUsed = [
  {
    id: 0,
    name: 'first',
    price: '2',
    count: '4',
  },
  {
    id: 1,
    name: 'second',
    price: 1,
    count: 8,
  },
]

const validToolsUsed = toolsUsed.map(item => ({
    ...item, 
    isValid: ['name', 'price', 'count']
      .every(key => item[key].length > 0 )
  })
)