时间戳

首页 > 解决方案 > Redux - 提供 Provider 后如何访问商店“dispatch”？

redux - Redux - 提供 Provider 后如何访问商店“dispatch”？

问题描述

我有以下文件：

index.js

const store = createStore(...)
ReactDOM.render(<Provider store={store}><BrowserRouter><App/></BrowserRouter></Provider>, document.getElementById('root'));

App组件：（App.js ）

const App = withRouter(connect(mapStateToProps, mapDispatchToProps)(Main))
export default App

那么我如何访问组件store.dispatch内部Main呢？如果我尝试这样做，store.dispatch({...})我会得到：

'store' 未定义 no-undef

标签： redux

解决方案

如果 mapDispatchToProps 看起来像：

const mapDispatchToProps = dispatch => ({
    myAction1: () => dispatch(myAction1())
});

connect(mapStateToProps, mapDispatchToProps)(Main)

...然后在组件中，您可以调用this.props.myAction1()

如果 mapDispatchToProps 使用bindActionCreators：

const actions = { myAction1, myAction2 };

const mapDispatchToProps = dispatch => bindActionCreators(actions, dispatch);

...然后在组件中，您可以调用this.props.myAction1()和this.props.myAction2()

如果 mapDispatchToProps 未定义：

connect(mapStateToProps)(Main)

然后在组件中，您可以访问 this.props.dispatch

推荐阅读