treecounter-app
treecounter-app copied to clipboard
Change of componentWillMount and componentWillReceiveProps for React 17
There are warning from react in the browser console about deprecated methods which will have to be changed before upgrading to react 17, e.g.:
Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.
- Move code with side effects to componentDidMount, and set initial state in the constructor.
- Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run
npx react-codemod rename-unsafe-lifecycles
in your project source folder.Please update the following components: NotificationContainer, SideMenuContainer, TransitionGroup
Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.
- Move data fetching code or side effects to componentDidUpdate.
- If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://fb.me/react-derived-state
- Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run
npx react-codemod rename-unsafe-lifecycles
in your project source folder.Please update the following components: Autosuggest, Autowhatever, BodyErrorBoundary, SideMenuContainer, TransitionGroup
Read more at: https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html