javascript - 在 JSX 的嵌套 map 函数中 react JS 打印数据

标签 javascript reactjs nested-loops jsx

我正在尝试在嵌套 map 函数中打印数据。由于某种原因,它不打印任何东西。这是我所拥有的:

  {dataFormat.protein_questions.map((item, index) => (
        <div key={_.uniqueId()} className="item">
         <div className="inline fields">
           <Field
              onChange={handleChange}
              name={`protein_question[${index}].units_of_measurement`}
              component="select"
              className="ui dropdown2"
              required>

                 {item.typing_methods.map((method, methodIndex) => {
                    method.unitsOfMeasurement.map((unit, unitIndex) => (
                       <option value={unit.title}>{unit.title}</option>
                    ));
                 })}

          </Field>
         </div>
       </div>
  ))}

由于某种原因,选项没有在选择中打印任何数据。当我在嵌套循环中控制台记录数据时,它显示正常。有人知道为什么会这样吗?

顺便说一句,这是在我的 JSX View 文件中的渲染函数中。

最佳答案

看起来你在 method.unitsOfMeasurement... 之前忘记了 return:

{item.typing_methods.map((method, methodIndex) => {
  return method.unitsOfMeasurement.map((unit, unitIndex) => (
    <option value={unit.title}>{unit.title}</option>
  ));
})}

关于javascript - 在 JSX 的嵌套 map 函数中 react JS 打印数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46705692/

相关文章:

javascript - 卸载组件时取消图像加载

javascript - React 中的 .render() 函数在内部是如何工作的?

python-2.7 - 保留一些数据不重复并添加到现有的 python 数据框中

python - 嵌套循环的字典理解没有按计划工作

javascript - 尝试更新状态内的对象但错误不允许我这样做?

javascript - 获取包含特定文本的 div 的数量

javascript - authContext.login() 导致帧中出现 “Refused to display ‘login.microsoftonline.com…’,因为它将 ‘X-Frame-Options’ 设置为 ‘deny’ ”

reactjs - React - 如何在同一文件上导出多个组件,防止开发工具上的 <Unknown/> 组件

javascript - 如何从组件中引用 SCSS 文件的目录?

c++ - 在 for(int i=0;...) { for(int j=0; ...){summation}} 嵌套 for 循环中求和势能不起作用