react-native - create-react-native-app 显示新警告

Question

使用 create-react-native-app 创建新应用程序现在会生成新警告。我需要做些什么来纠正警告？例如，我将如何更新列出的组件:

 ExpoRootComponent, RootErrorBoundary, Text, View

这是新的警告:(所有这些都可以忽略吗？create-react-native-app 会更新为使用 0.55.x 吗？)

14:30:04: Warning: componentWillMount is deprecated and will be removed in 
the next major version. Use componentDidMount instead. As a temporary 
workaround, you can rename to UNSAFE_componentWillMount.

Please update the following components: ExpoRootComponent, 
RootErrorBoundary, Text, View

Learn more about this warning here:
xxx:/fb.me/react-async-component-lifecycle-hooks
- node_modules\react-native\Libraries\ReactNative\YellowBox.js:82:15 in warn
- node_modules\react-native\Libraries\Renderer\ReactNativeRenderer- 
dev.js:5706:19 in printWarning
- ... 21 more stack frames from framework internals
14:30:06: Warning: componentWillReceiveProps is deprecated and will be 
removed in the next major version. Use static getDerivedStateFromProps 
instead.

Please update the following components: Text, View

Learn more about this warning here:
xxx:/fb.me/react-async-component-lifecycle-hooks
- node_modules\react-native\Libraries\ReactNative\YellowBox.js:82:15 in warn
- node_modules\react-native\Libraries\Renderer\ReactNativeRenderer- 
dev.js:5706:19 in printWarning
- ... 21 more stack frames from framework internals

Answer 1

我已经有一段时间没有使用 react-native，但我每天都在使用 React。

您可能会遇到与新的 Context API 有关的事情。你应该阅读这个:https://github.com/facebook/react-native/issues/18175

基本上，componentWillMount将被弃用，可能在明年左右，之后，它将消失。相反，您应该能够更改所有 componentWillMount生命周期方法到 componentDidMount .

要清楚，这是:

componentWillMount() {
  performTask()
}

变成:

componentDidMount() {
  performTask()
}

区别主要在于当生命周期方法被调用。值得注意的是，这些都只是函数，没有什么特别神奇的地方。
componentWillMount()当组件即将开始安装时运行，而古老的风险是，如果您在其中执行类似网络请求的操作(这是一种反模式)，您可能会在组件安装之前获得网络响应，因此例如，它将无法使用数据正确设置组件的状态。
componentDidMount()当组件被挂载并在 DOM 中时运行。

我猜想这种弃用至少与帮助人们在组件安装时避免状态问题有关。其余的弃用可能是由于新的 Context API。

你可以在这里阅读:https://reactjs.org/docs/context.html

为您提供有关这些更改的“上下文”的最快方法是，它旨在改进像 Redux Provider 这样的传递数据，如果您还记得的话:

<Provider store={store}>
  <App />
</Provider>

注意那里的商店。有一些与商店相关的变化，最终可能会弃用 Redux。如果您有兴趣，我建议您进一步研究它。

另一件要提到的事情是，即将发生与异步渲染有关的严重而重大的变化，这将极大地影响渲染性能，尤其是在大型复杂应用程序中。

要了解所有内容，请观看 Dan Abramov 的这段视频:
https://www.youtube.com/watch?v=v6iR3Zk4oDY

再次注意，React 16.3+

与此同时，您或许可以降级回 React 16.2 并恢复您认为正常的内容，但我是推测。