1、以往项目比较单一,只会有一个store;
提供方写法:
<Provider store={store}>{children}</Provider>
接收方写法:
const Component = ({count})=> <h1>{count}</h1>
const mapStateToProps = state =>{
return {
count: state.count
}
}
connect(mapStateToProps)(Component)
2、当项目中有多个store时,
按照下面写法只能获取到最近的store里的信息,其余的store都会被屏蔽;
提供方写法:
<Provider store={store}>
<Provider store={store1}>
{children}
</Provider>
</Provider>
接收方写法:
const Component = ({count})=> <h1>{count}</h1>
const mapStateToProps = state =>{
return {
count: state.count
}
}
connect(mapStateToProps)(Component)
- react-redux 5.1.2 指定storeKey,便可以获取相应的store,默认值 store 提供方:
const Provider1 = createProvider('null')
<Provider store={store}>
<Provider1 store={store1} context={Store1Context}>
<>
<h1>count</h1>
<App />
<Button/>
</>
<hr/>
<>
<h1>name</h1>
<Name />
<Input/>
</>
</Provider1>
</Provider>
接收方:
const App = props =>{
return <h1>{props.name}</h1>
}
const mapStateToProps = state=>{
return {
name: state
}
}
export default connect(mapStateToProps, null, null, {
storeKey: 'null'
})(App);