了解React.js中数组子项的唯一键

作者: 狗头军师
发布时间: 2025-01-13 07:52:01 (27天前)

2 条回复

1#
回复此人
v-star*위위 | 2020-08-05 15-24

这样，React可以处理最小的DOM更改。在您的代码中，每个人`<TableRowItem key={item.id} data={item} columns={columnNames}/>`都试图在其中渲染一些没有键的子级。检查此示例。尝试key={i}从<b></b>div内部的元素中删除（并检查控制台）。在示例中，如果我们不给钥匙<b>，而我们也希望更新只在object.city起反应需要重新渲染整个行VS只是元素。这是代码： ``` var data = [{name:'Jhon', age:28, city:'HO'}, {name:'Onhj', age:82, city:'HN'}, {name:'Nohj', age:41, city:'IT'} ]; var Hello = React.createClass({ render: function() { var _data = this.props.info; console.log(_data); return( <div> {_data.map(function(object, i){ return <div className={"row"} key={i}> {[ object.name , // remove the key <b className="fosfo" key={i}> {object.city} </b> , object.age ]} </div>; })} </div> ); } }); React.render(<Hello info={data} />, document.body); ```

编辑

登录后才能参与评论