不推荐使用componentWillMount,它将在React Native的下一个主要版本0.54.0中删除

Question

我使用的是本机最新版本的0.54.0和每当在iOS上运行应用程序时,发现有关弃用生命周期方法的警告.还请更新组件.

警告 :

不推荐使用componentWillMount,将在下一个主要版本中删除它.请改用componentDidMount.作为临时解决方法,您可以重命名为UNSAFE_componentWillMount.请更新以下组件:容器,文本,TouchableOpacity,Transitioner,View

我也根据waring添加前缀UNSAFE_的每个方法进行更改.

UNSAFE_componentDidMount() {
}
UNSAFE_componentWillMount() {
}
UNSAFE_componentWillUpdate(nextProps, nextState) {
}
UNSAFE_componentWillReceiveProps(nextProps) {
}

虽然警告仍在继续.请帮我.

目前我在我的应用程序中隐藏了YellowBox waring.

import { YellowBox } from 'react-native';

render() {

  YellowBox.ignoreWarnings([
    'Warning: componentWillMount is deprecated',
    'Warning: componentWillReceiveProps is deprecated',
  ]);
}

Answer 1

您应该将componentWillMount中的所有代码移动到构造函数或componentDidMount.

在安装发生之前调用componentWillMount().它在render()之前调用,因此在此方法中同步调用setState()不会触发额外的渲染.通常,我们建议使用构造函数().避免在此方法中引入任何副作用或订阅.对于这些用例,请改用componentDidMount().这是服务器渲染上唯一的生命周期钩子.

在装入组件后立即调用componentDidMount().需要DOM节点的初始化应该放在这里.如果需要从远程端点加载数据,这是实例化网络请求的好地方.此方法是设置任何订阅的好地方.如果您这样做,请不要忘记取消订阅componentWillUnmount().在此方法中调用setState()将触发额外的渲染,但它将在浏览器更新屏幕之前发生.这保证了即使在这种情况下将调用render()两次,用户也不会看到中间状态.请谨慎使用此模式,因为它通常会导致性能问题.但是,当您需要在渲染依赖于其大小或位置的内容之前测量DOM节点时,可能需要对模态和工具提示等情况进行处理.

来自官方文档

Answer 2

componentDidMount不会被弃用，并且绝对仍然可以安全使用，因此不需要添加UNSAFE_该方法。componentWill Something方法似乎正在淘汰。代替componentWillMount，不要为不会产生副作用的东西使用构造函数，而为会产生副作用的东西使用构造函数componentDidMount。

Answer 3

你应该避免使用componentWillSomething为了使用 constructor 或componentDidMount

但是，您必须非常小心地使用哪一种。一个典型的场景是当你想在打开屏幕后立即显示加载（使用状态）

this.setState({ isLoading: true });
...
this.setState({ isLoading: false});

在这种情况下，您必须使用componentDidMount才能设置状态。这就是 React 所说的constructors

通常，在 React 中，构造函数仅用于两个目的：

1. 通过将对象分配给 this.state 来初始化本地状态。

2. 将事件处理程序方法绑定到实例。

您不应在构造函数() 中调用setState()。相反，如果您的组件需要使用 localstate，请直接在构造函数中将初始状态分配给 this.state。

好编码！