pass "key" param to react component

Question

I am trying to pass a parameter with name "key" to a react component and it does not work. If i use "keyy" instead of "key" then it works.

It seems for me that "key" is a restricted keyword and I can not use it as a name of parameter.

Is that true?

That is my example:

render() {
   <MyComponent key='apple'
                keyy='pear'>
}

Answer 1

Yes, that is true, key is a restricted keyword and doesn't get propagated as props.

---

Keys serve as a hint to React but they don't get passed to your components. If you need the same value in your component, pass it explicitly as a prop with a different name:

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

With the example above, the Post component can read props.id, but not props.key.

Read more in the docs