中props使用this报错_React子组件props状态更新前后对比

使用生命周期：getDerivedStateFromProps和componentDidUpdate
（getDerivedStateFromProps前身componentWillReceiveProps）

1、首先在当前组件获取父组件通过props传入的状态

this.state = {
     visible: this.props.visible,
}
//当前组件，我们通过state取父组件的props

2、当props发生改变时getDerivedStateFromProps执行，将改变后的props更新到当前state

static getDerivedStateFromProps(nextProps, prevState) {
        //该方法内禁止访问this
        if (nextProps.visible !== prevState.visible) {
            //通过对比nextProps和prevState，返回一个用于更新状态的对象
            return {
                visible: nextProps.visible
            }
        }
        //不需要更新状态，