juntaki
2/27/2017 - 4:44 PM

Reduxをソースコードから理解する その2 ref: http://qiita.com/juntaki/items/7df6a6cbca990281ced8

Reduxをソースコードから理解する その2 ref: http://qiita.com/juntaki/items/7df6a6cbca990281ced8

ReactDOM.render(
  <Provider store={store}>
    <MyRootComponent />
  </Provider>,
  rootEl
)
// createConnect with default args builds the 'official' connect behavior. Calling it with
// different options opens up some testing and extensibility scenarios
export function createConnect({
  connectHOC = connectAdvanced,
・・・
} = {}) {
  return function connect(
・・・
  ) {

    return connectHOC(
・・・
    })
  }
}

export default createConnect()
export default function connectAdvanced(
・・・
) {
・・・
  const contextTypes = {
    [storeKey]: storeShape,
    [subscriptionKey]: subscriptionShape,
  }

  return function wrapWithConnect(WrappedComponent) {
    class Connect extends Component {
・・・
      render() {
・・・
        if (selector.error) {
          throw selector.error
        } else {
          return createElement(WrappedComponent, this.addExtraProps(selector.props))
        }
      }
    }

    Connect.childContextTypes = childContextTypes

    return hoistStatics(Connect, WrappedComponent)
  }
export default class Provider extends Component {
  getChildContext() {
    return { store: this.store, storeSubscription: null }
  }

  constructor(props, context) {
    super(props, context)
    this.store = props.store
  }

  render() {
    return Children.only(this.props.children)
  }
}

Provider.childContextTypes = {
  store: storeShape.isRequired,
  storeSubscription: subscriptionShape
}
export const storeShape = PropTypes.shape({
  subscribe: PropTypes.func.isRequired,
  dispatch: PropTypes.func.isRequired,
  getState: PropTypes.func.isRequired
})