react 生命周期 之getDerivedStateFromProps

本文主要是介绍react 生命周期 之getDerivedStateFromProps，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

参考：https://www.jianshu.com/p/50fe3fb9f7c3

getDerivedStateFromProps

React生命周期的命名一直都是非常语义化的，这个生命周期的意思就是从props中获取state，可以说是太简单易懂了。

可以说，这个生命周期的功能实际上就是将传入的props映射到state上面。

由于16.4的修改，这个函数会在每次re-rendering之前被调用，这意味着什么呢？

意味着即使你的props没有任何变化，而是父state发生了变化，导致子组件发生了re-render，这个生命周期函数依然会被调用。看似一个非常小的修改，却可能会导致很多隐含的问题。

使用

这个生命周期函数是为了替代componentWillReceiveProps存在的，所以在你需要使用componentWillReceiveProps的时候，就可以考虑使用getDerivedStateFromProps来进行替代了。

两者的参数是不相同的，而getDerivedStateFromProps是一个静态函数，也就是这个函数不能通过this访问到class的属性，也并不推荐直接访问属性。而是应该通过参数提供的nextProps以及prevState来进行判断，根据新传入的props来映射到state。

需要注意的是，如果props传入的内容不需要影响到你的state，那么就需要返回一个null，这个返回值是必须的，所以尽量将其写到函数的末尾。

static getDerivedStateFromProps(nextProps, prevState) {const {type} = nextProps;// 当传入的type发生变化的时候，更新stateif (type !== prevState.type) {return {type,};}// 否则，对于state不进行任何操作return null;
}

作者：老鼠AI大米_Java全栈
链接：https://www.jianshu.com/p/50fe3fb9f7c3
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

组件实例化之后接收到一个新属性(props)时调用该函数，该函数返回一个对象来更新状态(state)，修改state时一般不会触发该函数，父组件重新渲染该函数一定会被调用
getDerivedStateFromProps 是新的生命周期，暂时不怎么用，可能17以后会比较有用

这篇关于react 生命周期 之getDerivedStateFromProps的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---