如何在React中渲染对象数组？

• Z时代
• 2024-01-10
• 分类：问答

你能告诉我如何在react js中渲染列表吗？我喜欢这样

class First extends React.Component {
  constructor (props){
    super(props);
  }
  render() {
     const data =[{"name":"test1"},{"name":"test2"}];
    const listItems = data.map((d) => <li key={d.name}>{d.name}</li>;
    return (
      <div>
      hello
      </div>
    );
  }
}

回答：

您可以通过两种方式进行操作：

render() {
    const data =[{"name":"test1"},{"name":"test2"}];
    const listItems = data.map((d) => <li key={d.name}>{d.name}</li>);
    return (
      <div>
      {listItems }
      </div>
    );
  }

直接在返回中编写map函数

render() {
    const data =[{"name":"test1"},{"name":"test2"}];
    return (
      <div>
      {data.map(function(d, idx){
         return (<li key={idx}>{d.name}</li>)
       })}
      </div>
    );
  }

以上是 如何在React中渲染对象数组？ 的全部内容， 来源链接： utcz.com/qa/428066.html