I'm trying to create a wrapper component around the react-router-dom NavLink
component.
I would like my custom component to accept all of NavLinks props, and proxy them down to NavLink
.
However when I do this, I'm getting:
Warning: React does not recognize the
staticContext
prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercasestaticcontext
instead. If you accidentally passed it from a parent component, remove it from the DOM element.
A working demo of the issue can be found here:
The "Cannot read property 'props' of undefined" error occurs when a class method is called without having the correct context bound to the this keyword. To solve the error, define the class method as an arrow function or use the bind method in the classes' constructor method.
React will assign the current property with the DOM element when the component mounts, and assign it back to null when it unmounts. ref updates happen before componentDidMount or componentDidUpdate lifecycle methods.
shouldForwardProp ( (prop: string) => bool [optional]): Indicates whether the prop should be forwarded to the Component .
There is a way to overcome that is using:
const { to, staticContext, ...rest } = this.props;
So your ...rest
will never contain staticContext
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