入口文件

import Provider from "./provider"
import connect from "./connect"
export default {
    Provider, connect
}

provider.js

这个文件是对 createContext 中 Provider 的一层封装

import React, {Component} from "react";
import Context from "./reactContext";

export default reduxContext = React.createContext(null); 

export default class extends Component {
    render() {
        return (
            <Context.Provider value={{store: this.props.store}}>
                {this.props.children}
            </Context.Provider>
        )
    }
}

// egg: <Provider store={store}></Provider>

connect.js

这个文件是主要对mapStateTProps 和 mapDispatchToProps 的两个方法的封装，对dispatch action 之后的state 状态修改，和销毁时将订阅的subscribe 的删除

• mapStateToProps 主要是处理当前组件需要的state数据，将其返回，是个函数
• mapDispatchToProps 主要是 处理action 的，可能是个函数，也可能是个对象

import React, {Component} from 'react';
import ReduxContext from "./reactContext";
import bindActionCreators from "../0.myredux/bindActionCreators"
export default function (mapStateToProps, mapDispatchToProps) {
    return function (WrappedComponent) {

        return class extends Component {
            static contextType = ReduxContext;
            constructor(props, context){ // 这个context 是上下文中的props 也就是{store: xxx}
                super(props);
                this.state = mapStateToProps(context.store.getState())
            }

            componentDidMount() {
                this.unsubscribe = this.context.store.subscribe(() => {
                    this.setState(mapStateToProps(this.context.store.getstate))
                })
            }
            componentWillUnmount() {
                this.unsubscribe()
            }
            render() {
                let actions = null;
                if(tpyeof(mapDispatchToProps) === "function") {
                    actions = mapDispatchToProps(this.context.store.dispatch);
                } else {
                    actions = bindActionCreators(mapDispatchToProps, this.context.store.dispatch)
                }
                return (
                    <WrappedComponent 
                        dispatch={this.context.store.dispatch}
                        {...actions} 
                        {...this.state}
                    />
                )
            }
        }
    }
} 


//egg:   connect(mapStateToProps, mapDispatchToProps)(Counter)