React 学习笔记 8 （React.createContext源码简单实现）

1.获取上下文对象，提供Provider和Consumer方法，可以跨组件传递信息，一般用在React-redux中

function createContext() {
    class Provider extends React.Component {
        static value;
        constructor(props) {
            super(props);//{value:xx}
            Provider.value = props.value;
        }
        /*         componentWillReceiveProps(nextProps){
          Provider.value = nextProps.value;
        } */
        //每当此组件接收到新的属性的时候，都会执行这个方法，这个方法会返回新的状态对象
        static getDerivedStateFromProps(nextProps, prevState) {
            Provider.value = nextProps.value;
            return prevState;
        }
        render() {
            return this.props.children;
        }
    }
    class Consumer extends React.Component {
        render() {
            return this.props.children(Provider.value);
        }
    }
    return { Provider, Consumer }
}