反应 尝试使用forEach函数时显示错误

Question

当我尝试通过forEach迭代器按条件从父组件Row发送道具时，我什至在子组件中得到了undefined 。

我不知道问题是什么...

 // Parent component
 // ... class Row extends...
     // ... some code
      render() {
        const canSelector = {
           selectedItems: []
        }
        return (
            <Row showImage={canSelector.selectedItems.forEach(item => { 
                   item.ID === i ? 'item' : 'error'}) }
            />
          }            
        )


// Child component for test
// ... class XXX extends...
         // ... some code
         const { showImage } = this.props
         console.log(showImage); // gets "undefined", intead of "error" string

Answer 1

Array.prototype.forEach（）不返回任何内容，这就是在<Row />组件showImage undefined为showImage值的showImage 。

我假设您正在尝试检查item.ID是否具有与i相同的值，并相应地返回'item'或'error' ？

您可能要检查Array.prototype.findIndex（） 。

您可以执行以下操作：

<Row showImage={canSelector.selectedItems.findIndex(item => item.ID === i) > -1 ? 'item' : 'error'} />

findIndex()将返回满足所提供条件的数组中第一项的索引，否则将返回-1 。