How the redux subcomponent gets the action? bound by the bindActionCreators method

//import

const store = applyMiddleware(ReduxThunk)(createStore)(reducers);

const App = connect(
    state => (state),
    dispatch => ({
        action: bindActionCreators(actions, dispatch)
    })
)(Component);

const mountPoint = document.createElement("div");
mountPoint.setAttribute("id", "root");
document.body.appendChild(mountPoint);

render(
    <Provider store={store}>
        <App />
    </Provider>,
    mountPoint
);

I know that subcomponents can get store, by setting contextTypes, but there are only dispatch, getState and other methods in store, and there is no action that bindActionCreators has handled.
this causes me to re-initiate an update state request with dispatch in the subcomponent

I guess the reason is that action is on the App component, not on Provider.
so do subcomponents have to set childContextTypes in the App component if they want to get action through context?

I heard that redux encapsulates react"s context. Would it be out of redux to write childContextTypes, in the App component?


applying redux in react should follow the hierarchical design pattern (react-redux) of container components and UI components.
if you have the need to call action in a child component, then one is that the parent component passes action to the child component through props , and the other is to create a container component of a child component that binds actions through mapDispatchToProps in the container component.
following this design pattern makes layering clearer, reduces coupling, and facilitates reuse and unit testing.
A good hierarchical design is good for testing. Please see this article: https://codeshelper.com/a/1190000015935519


this.props.action.<actionName>
Menu