时间戳

首页 > 解决方案 > 在数组reactjs中查找元素

javascript - 在数组reactjs中查找元素

问题描述

 constructor(props) {
    super(props);
    this.state = {
    number: [{
          id : 10,
      },
      {
          id: 20,
      }    
    ]
}
...
render() {
    const { number } = this.state;
    return (
        {number.map(numbers => (
            <div>
               {numbers[1]}
            </div>
        ))}
    )
}
...

{numbers[1]}不工作。我想在屏幕上看到 20。我查看了 https://reactjs.org/docs/lists-and-keys.html但找不到解决方案。我该如何解决。谢谢你。

标签： javascriptreactjs

解决方案

numbers[1]无效，因为 numbers 将是一个对象，{id: 20}而您想要渲染对象的 id，您将首先过滤您希望使用的对象，然后映射和渲染

render() {
   const { number } = this.state;
   return (
       {number.filter(data => {
          return data.id == 20; // any condition here
       }).map(numbers => (
          <div>
            {numbers.id}
          </div>
       ))}
   )
}

如果您只想访问单个元素，您只需编写

render() {
   const { number } = this.state;
   return (
       <div>
          {number[1].id}
       </div>
   )
}

推荐阅读