【问题标题】:trying to print an array in an object, but not working(reactjs)试图在对象中打印数组,但不工作(reactjs)
【发布时间】:2021-02-10 22:20:51
【问题描述】:

我正在尝试在这个对象中打印数组:

但是,这段代码不起作用:

{templates.map(item => { return <li>{item[0]}</li>; })}

【问题讨论】:

  • 你能显示你正在使用的代码不起作用吗?
  • {templates.map(item => { return
  • {item[0]}
  • ; })}
  • 当您编辑问题以包含您的代码时效果最佳(我已经为您完成了)。在 stackoverflow 上创建问题时,请记住,我们对您没有告诉我们的代码一无所知。当您的问题没有包含足够的信息让我们甚至无法理解您想要做什么时,您更有可能获得反对票和接近票而不是答案。
  • 标签: node.js reactjs


    【解决方案1】:

    查看您正在使用的代码:item[0],您似乎认为item 是一个数组,并且您正试图获取数组中第一个元素的值。但是,查看对象,您可以看到 templates 包含对象,而不是数组。所以,item[0] 是未定义的。

    这引出了一个问题,当您说要“打印数组”时,您的意思是什么?是否要打印代表每个对象的 JSON 字符串?

    templates.map(item => <li>{JSON.stringify(item)}</li>)
    

    还是要打印对象上唯一属性的值?

    templates.map(item => <li>{item.Template_id}</li>)
    

    这是一个工作示例,它打印 templates 数组中每个项目的 Template_id 属性:

    const obj = {
      name: "After_Effects",
      templates: [
        { Template_id: "601071694b0146303c10d68c" },
        { Template_id: "601072e04b0146303c10d68d" },
        { Template_id: "601073114b0146303c10d68e" },
      ],
      __v: 0,
      _id: "60106addf83a155344bf3edb",
    };
    const listItems = obj.templates.map(item => <li>{item.Template_id}</li>);
    ReactDOM.render(<ul>{listItems}</ul>, document.querySelector("main"));
    li {
      list-style-type: none;
      font-family: monospace;
    }
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
    <main></main>

    【讨论】:

      猜你喜欢
      相关资源
      最近更新 更多
      热门标签