如何从 reactjs 组件访问“ key”属性

如何访问组件的 key属性。我以为会在这里,道具,但是没有。

例如:。

<ProductList
key = {list.id}
listId = {list.id}
name = {list.name}
items = {list.items}
/>

如果我这样做,在产品列表中

console.log(this.props)

报税表

Object {listId: "list1", name: "Default", items: Array[2]}

完全没有钥匙属性。我可以创建另一个属性并为其赋予相同的值,但这似乎是多余的,因为键属性已经被使用了。

此外,key 属性是否必须在整个组件中是唯一的,还是仅在呈现它的循环或集合中是唯一的?

57290 次浏览

key属性由 React 在引擎盖下使用,不会暴露给您。您需要使用一个自定义属性并将该数据传递进来。我建议使用一个有语义意义的属性名; key只是为了在协调期间帮助标识 DOM 节点,因此使用另一个名为 listId的属性是有意义的。

key属性不需要对于整个组件是唯一的,但是我相信对于您所在的嵌套级别(通常是循环或集合)它应该是唯一的。如果 React 检测到重复的 key出现问题(在开发构建中) ,它将抛出一个错误:

警告: 扁平的孩子(...) : 遇到两个孩子用相同的关键字,.$a。子键必须是唯一的; 当两个子键共享一个键时,将只使用第一个子键。

: this._reactInternalFiber.key

指数 : this._reactInternalFiber.index