React 16.4的新变化：getDerivedStateFromProps 的变更

React 16.4中getDerivedStateFromProps的变化

React 16.4中对getDerivedStateFromProps做出了一个错误修复，这可能会导致一些现有的错误在组件中重现。如果您的应用程序使用了一些反模式，并且在修复后无法正常工作，我们对此表示抱歉。

getDerivedStateFromProps是一个生命周期方法，它允许组件在收到新的props时更新其状态。它在React 16.3中引入，并很快成为最常用的生命周期方法之一。然而，在React 16.4中，getDerivedStateFromProps的实现方式做出了改变，这导致了一些现有的错误在组件中重现。

最常见的错误之一是，在getDerivedStateFromProps中使用this.state。这在React 16.3中是允许的，但在React 16.4中不再允许。这是因为getDerivedStateFromProps是在渲染阶段调用的，而此时this.state尚未更新。因此，在getDerivedStateFromProps中使用this.state可能会导致不正确的结果。

另一个常见的错误是，在getDerivedStateFromProps中执行副作用。副作用是指任何可能改变组件状态或导致重新渲染的操作，例如调用setState()或AJAX请求。在getDerivedStateFromProps中执行副作用可能会导致意外的行为，并可能导致组件陷入死循环。

如何避免这些错误

为了避免这些错误，您应该遵循以下最佳实践：

• 避免在getDerivedStateFromProps中使用this.state。
• 避免在getDerivedStateFromProps中执行副作用。
• 如果您需要在getDerivedStateFromProps中执行副作用，请使用useEffect()生命周期方法。

结语

getDerivedStateFromProps是一个强大的生命周期方法，但它也可能导致错误。如果您遵循这些最佳实践，您就可以避免这些错误，并有效利用getDerivedStateFromProps来更新组件的状态。

常见问题解答

1. 什么是getDerivedStateFromProps？

getDerivedStateFromProps是一个生命周期方法，它允许组件在收到新的props时更新其状态。它在React 16.3中引入，并很快成为最常用的生命周期方法之一。

2. 为什么React 16.4中getDerivedStateFromProps的实现方式发生了改变？

React 16.4中getDerivedStateFromProps的实现方式发生了改变，是为了修复一个错误。这个错误会导致在getDerivedStateFromProps中使用this.state时出现不正确的结果。

3. 如何避免在getDerivedStateFromProps中出现错误？

为了避免在getDerivedStateFromProps中出现错误，您应该遵循以下最佳实践：

• 避免在getDerivedStateFromProps中使用this.state。
• 避免在getDerivedStateFromProps中执行副作用。
• 如果您需要在getDerivedStateFromProps中执行副作用，请使用useEffect()生命周期方法。

4. useEffect()生命周期方法是什么？

useEffect()生命周期方法允许您在组件挂载、更新和卸载时执行副作用。它在React 16.8中引入，并取代了componentWillMount()、componentDidMount()、componentWillReceiveProps()、componentWillUpdate()和componentWillUnmount()等生命周期方法。