如何在React.js中映射嵌套数组？

Question

问题：我只能渲染数组的一个迭代。

我想要的结果当然是获得数组对象的整个长度。

将[key]添加到渲染对象字段是唯一可以提供任何输出的方法。 如果不这样声明密钥，我什么也得不到

子组件

...
const Potatoes = ({potatoes}) => {
  const PotatoItems = potatoes.map((potato, key) => {
    if ([potato] == ''){
      return false
    } else {
    return (
      <li key={key}>
        <span>{potato[key].name}</span>
        <span>{potato[key].flavor}</span>
      </li>);
    }
  });
  return (
    <div>
      <ul>
        {PotatoItems}
      </ul>
    </div>
  );
};

父组件

 ...
 render () {
    const potatoes = new Array(this.props.potatoes);

    return (
      <section style={divStyle}>
         <Potatoes potatoes={potatoes} />
      </section>
    )
 }

Answer 1

只需从土豆常量周围删除新的Array（）即可解决您的问题。

看来您可能已经创建了不必要的其他数组。

然后，您可以删除子组件中对象上的[key]引用，您应该一切顺利！

这样可以解决您的问题吗？