reactjs 使用Map函数时如何在React JSX中定义键

wkyowqbh  于 2023-03-08  发布在  React
关注(0)|答案(1)|浏览(125)

我有对象数组,需要循环并在DOM中显示它。我可以用map函数来完成。但是我得到了错误,因为没有为它提供唯一的键。记住,它没有使用组件来循环。我只是想让JSX循环通过它。那么我们如何在它中提供键。代码如下。提前感谢!

import React from 'react';
import {Component1, Component2} from './Component';

const data=[
  {
    title: "Sample Title One",
    description: "Sample Description One"
  },{
    title: "Sample Title Two",
    description: "Sample Description Two"
  }]

function App(){
  return(
    <div className="data">
      {data.map((item)=>{
        return <div className="wrapper">
          <div className="title">{item.title}</div>
          <div className="description">{item.description}</div>
        </div> 
      })}
    </div>
  )
}
export default App;

我尝试了以下<div className="wrapper" keys={item.title}>

wfsdck30

wfsdck301#

我觉得这是

<div className="wrapper" key={item.title}>

相关问题