react-select: Warning: `ref` is not a prop
Hello,
I am using ref in <Select.Creatable ref={(node) => this.selector = node} /> and getting this warning:
CreatableSelect: ref 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.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 44
- Comments: 15 (2 by maintainers)
Commits related to this issue
- Use `innerRef` prop instead of `ref` to avoid warning Fixes #2181 — committed to meriadec/react-select by meriadec 6 years ago
Any updates regarding this?
I am also seeing this warning in the console, it would be great to be able get rid of it.
This is with react 16.2.0 & react-select 1.2.0
+1
Sorry for that little outburst, lol. I solved my issue using
React.forwardRef(https://reactjs.org/docs/forwarding-refs.html).I think the fact that multiple people reported this issue, without a fix ever being pushed, is an indication that “this issue is still relevant.”
I am also seeing this error, but oddly, only via react-virtualized-select. When I use the component directly, it presents no problems.
The error, as far as I can tell, refers to the
ref: PropTypes.funcon line 293. When I remove it, the problem goes away.As a temporary solution, you can wrap Creatable in class-based component like this:
Or wrap in toClass, if you are using recompose
Hello -
In an effort to sustain the
react-selectproject going forward, we’re closing old issues.We understand this might be inconvenient but in the best interest of supporting the broader community we have to direct our efforts towards the current major version.
If you aren’t using the latest version of
react-selectplease consider upgrading to see if it resolves any issues you’re having.However, if you feel this issue is still relevant and you’d like us to review it - please leave a comment and we’ll do our best to get back to you!
#1646 appears to be causing warnings for me (react-select@1.1.0, react@15.6.2). I’m using ref={r=>this.selector = r} and getting:
Warning: CreatableSelect: ref 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. (https://fb.me/react-special-props)
I believe this is because ref is reserved, so you can’t really pass it through like you are. If you renamed it to selectRef for Creatable (and updated the documentation for this exception to the Select API) I believe that would solve the issue.
My code seems to still work ok (it was working before upgrading from rc10), but I’d like to get rid of the warning if possible.