react-redux 如何在子组件里访问store对象
1. 要在constructor-super里接收context对象
2. 给组件(class / pure function)指定contextType属性,用来接收store对象
以下代码模拟了connect(类似react-redux里connect的功能)高阶组件的实现:
function connect(mapStateToProps=doNothing, mapDispatchToProps=doNothing){ return function( WrappedComponent ){ class HOC extends React.Component{ constructor(props, context){ super(props, context); } render(){ const store = this.context.store; const stateProps = mapStateToProps(store.getState());// deliver state const dispatchProps = mapDispatchToProps(store.dispatch);// deliver dispatch const props = {...stateProps, ...dispatchProps}; return <WrappedComponent {...props}/>; } } HOC.contextTypes = { // get store from context store: PropTypes.object } return HOC; } } export {connect};
路漫漫其修远兮,吾将上下而求索。
May stars guide your way⭐⭐⭐