Question

我使用的反应本机最新版本为0.54.0，每当在iOS上运行应用程序时，都会发现有关弃用生命周期方法的警告。还请更新组件。

警告：

不推荐使用componentWillMount，将在下一个主要版本中删除。请改用componentDidMount。作为临时解决方法，您可以重命名为UNSAFE_componentWillMount。请更新以下组件：Container，Text，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节点然后再渲染依赖于其大小或位置的东西时，它可能需要像模态和工具提示这样的情况。

From the official docs

Answer 2

为了使用componentWillSomething或constructor，应避免使用componentDidMount

但是，您必须非常小心使用哪个。一种典型的情况是您要在打开屏幕后立即显示负载（使用状态）

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

在这种情况下，必须使用componentDidMount来设置状态。这就是React关于constructors

所说的话

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



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



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



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

好的编码！

Answer 3

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

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

3 个答案: