警告：componentWillReceiveProps 已重命名，不推荐使用

Posted 2023-02-23

【中文标题】警告：componentWillReceiveProps 已重命名，不推荐使用

【英文标题】：Warning: componentWillReceiveProps has been renamed, and is not recommended for use

【发布时间】：2020-04-13 04:39:42

【问题描述】：

我使用createBottomTabNavigator。

在我的课堂上

const Tab = createBottomTabNavigator(
  MainScreen:  screen: MainScreen ,
  SecondScreen:  screen: SecondScreen 
);

const Container = createAppContainer(Tab);

export default class App extends React.Component 
  state = 
    isReady: false
  ;
  componentDidMount = () => 
    this._load();
  ;
  render() 
    const  isReady  = this.state;
    if (!isReady) 
      return <AppLoading />;
    
    return <Container />;
  
  _load = async () => 
    try 
      this.setState( isReady: true );
     catch (error) 
  ;

这是我的 package.json

"dependencies": 
    "expo": "~36.0.0",
    "react": "^16.12.0",
    "react-dom": "~16.9.0",
    "react-native-gesture-handler": "^1.5.2",
    "react-native-web": "~0.11.7",
    "react-navigation": "3.0.8"
  

这是我的错误

Warning: componentWillReceiveProps has been renamed, and is not recommended for use. 

* 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.
* 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: SafeView

我做了npx react-codemod rename-unsafe-lifecycles，但没用。

【参考方案1】：

即使在使用带有最新 React 版本的 react-navigation 3.x 后，它仍然会发生，因为 react-navigation 依赖于 "@react-navigation/native": "^3.6.2"，它使用 "react-native-safe-area-view":"0.11"，其中 SafeAreaView 使用不推荐使用的方法。

@react-navigation/native 的 4.0.x 版本使用已更新的 0.14

所以升级你的反应导航。希望能帮助到你。如有疑问，请随意