Question

是否可以通过key访问我的react component？

   <LessonsLearnedNew
        key={item.id ?item.id[0]:item.tempID}

   />

  class LessonsLearnedNew extends Component {
      constructor(props) {
      console.log(props.key)  // coming as undefined
    }
  }

我发现了这样的解决方法。有更好的方法吗？

<LessonsLearnedNew
            key={item.id ?item.id[0]:item.tempID}
            keyVal={item.id ?item.id[0]:item.tempID}

       />

      class LessonsLearnedNew extends Component {
          constructor(props) {
          console.log(props.key)  // coming as undefined
          console.log(props.keyVal)  // getting the value
        }
      }

Answer 1

键不传递给组件。
从DOCS：

键只是React的提示，但不会传递给您的组件。如果您在组件中需要相同的值，则将其作为道具以不同的名称显式传递：

const content = posts.map((post) =>
  <Post
    key={post.id}
    id={post.id}
    title={post.title} />
);

因此，您的“解决方法”实际上是建议的模式。

Answer 2

Key是一个唯一的反应身份。因此，如果您对另一个组件有任何值，请使用props传递该值，并且键始终如此唯一。

 <LessonsLearnedNew
    key={item.id ?item.id[0]:item.tempID} //unique identity
    keyVal={item.id ?item.id[0]:item.tempID} // pass value as a props
  />

我可以在我的React组件中获取Key的值吗

2 个答案: