Select component in React.StrictMode, component is throwing errors
See original GitHub issueWhen we use the Select component in React strict mode then we could see the following errors:
findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Ref which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node.
Expected Behavior
-The component should render without any console errors.
Actual Behavior
- Getting error:
findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Ref which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node.
URL, screen shot, or Codepen exhibiting the issue
Code sandbox: https://codesandbox.io/s/objective-glitter-0dzqt?file=/src/App.tsx
Steps to Reproduce
- Click on the Select box.
- See the console errors
Your Environment
- Windows and browser is Chrome.
- Grommet version:
- Browser Name and version:
- Operating System and version (desktop or mobile):
Issue Analytics
- State:
- Created 3 years ago
- Reactions:3
- Comments:6 (2 by maintainers)
Top Results From Across the Web
Error Boundaries
A class component becomes an error boundary if it defines either (or both) of the lifecycle methods static getDerivedStateFromError() or componentDidCatch() .
Read more >Using strict mode in React 18: A guide to its new behaviors
Using strict mode in React 18: A guide to its new behaviors · The example above would throw an error since · You...
Read more >What is StrictMode in React?
It's used for highlighting possible problems. Since it's a developer tool, it runs only in development mode. It renders every component ...
Read more >React Components rendered twice — any way to fix this?
The reason why this happens is an intentional feature of the React.StrictMode . It only happens in development mode and should help to...
Read more >How To Customize React Components with Props
PropTypes are a simple type system to check that data matches the expected types during runtime. They serve as both documentation and an...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Same error with List
@kkgowtamasa Taking a look at this issue now