前言: 这是我在学习的时候遇到了这块的内容, 有些可能理解不到位, 还请指出
dva 提供了 connect 方法。如果你熟悉 redux,这个 connect 就是 react-redux 的 connect 。
Connect传递Model中的数据给router
比如model中定义的login.js 定义了state数据,那么在router组件中怎么获取到这个数据呢?
通过connect可以传递过来,然后通过this.props就可以访问了,同样也会将dispatch(可以发送请求到model去),history方法传递过来,这样就可以通过组件传递moel保存的值了
来看看两个模块把
1. index.jsx
import { connect } from 'umi'; const Welcome= (props) => { props.dispatch({ type: 'namespace/functionName' }) } const namespace = 'systembb'; const mapStates = (state) => { const systemList = state[namespace].system; return { systemList } } export default connect(mapStates)(Welcome); // 然后就可以在dom中使用 this.props.systemList了
1. models
/*** namespace 表示在全局 state 上的 key state 是初始值,在这里是空数组 reducers 等同于 redux 里的 reducer,接收 action,同步更新 state call 用来网络请求, put 然后yield put() 分发给 reducers 中 */ export default { namespace: 'systembb', state: { system: [ { name: 'this model date' } ] }, effects: { // {paylaod, callback}, {put, call} *getdata({payload, _}, { call, put }) { yield put({ type: 'setdata', payload: payload }) } }, reducers: { setdata(state, {payload}) { console.log(state) return { ...state, payload } } } }