When using React.js
Why do I get `ref` is not a prop
& `key` is not a prop.
error
Notes
ref
or key
defined in any of my react components.That's because ref is not a prop. Like key , it's handled differently by React. If you add a ref to a HOC, the ref will refer to the outermost container component, not the wrapped component.
React Warning: key is not a prop. Trying to access it will result in undefined being returned. If you need to access the same value within the child component, you should pass it as a different prop.
Refs provide a way to access DOM nodes or React elements created in the render method. In the typical React dataflow, props are the only way that parent components interact with their children. To modify a child, you re-render it with new props.
The warning " key is not a prop. Trying to access it will result in undefined being returned" is caused when we try to access the key prop of a component in React. To solve the error, pass a prop with a different name to your component. Here is an example of how the warning is caused.
Check this out: https://github.com/facebook/react/pull/5744
ref
and key
are reserved prop names in React, and are used internally. That's why you are getting this warning.
If you want to use ref
, use this.refs.yourinput
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With