[problem solve]解决react unsafe生命周期方法报警
2020-02-04 10:01:20   点击：

warning内容:

Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles 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.

react-dom.development.js:12357 Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.

...

原因：React v16.9之后，当你在新版本中使用旧的生命周期方法时，会提示该警告。

componentWillMount → UNSAFE_componentWillMount

componentWillReceiveProps → UNSAFE_componentWillReceiveProps

componentWillUpdate → UNSAFE_componentWillUpdate
 

解决方案：

1. 尝试按照警告信息中提供的命令解决。

 npx react-codemod rename-unsafe-lifecycles

2. 该codemod 脚本可以自动重命名我的代码。但是这里的原因是umi包的原因。

3. 找到Umi的issue，一个可行的方案是固定react的版本。

"react": "16.8.6",
"react-dom": "16.8.6"