Question

var MyComponent = props => {
    return <div key={ props.item.id }>{ props.item.title }</div> // key must be here?
}

myarray.map(item => <MyComponent key={ item.id } item={ item }>) // or here?

如何正确使用key属性？通过添加到我自己的组件或基础<div>元素中？

Answer 1

在您的情况下，它应该进入映射功能，而不是直接在div上。您希望键由React使用，而不要在DOM内部呈现。因此，我建议不要将它们放在div上，而应直接放在MyComponent上。

查看官方文档：https://reactjs.org/docs/lists-and-keys.html#extracting-components-with-keys

Answer 2

在呈现元素或组件数组的任何地方：

一个好的经验法则是map（）调用内的元素需要键。

React docs

键应该转到真正的HTML元素还是我自己的组件？

2 个答案: