React Redux遍历对象生成Select下拉菜单为空问题咨询

首次实现的错误原因 #

Object.keys(modalProps.rows)返回的是modalProps.rows对象所有键名组成的字符串数组，而非键对应的对象值数组。你在map回调中直接对字符串类型的键名做{id, name}解构，字符串本身不存在这两个属性，所以解构得到的id和name都是undefined，渲染出来的option既没有有效值也没有展示文本，下拉列表自然显示为空。

如果要保留首次的实现思路，仅调整取值逻辑即可正常运行，参考代码如下：

<Select name="replace_id" onChange={handleActivityAreaChange}>
  {console.log(modalProps.rows)}
  {Object.keys(modalProps.rows).map((key, index) => {
    const row = modalProps.rows[key]
    return (
      <option key={index} value={row.id}>
        {row.name}
      </option>
    )
  })}
</Select>

内容的提问来源于stack exchange，提问作者Patrick Simard