React dva脚手架Model

2019-05-14  本文已影响0人  AcessCors

Model是dva脚手架中很重要的部分,

代码如下:

namespace:'MyInf',

初始值,优先级低于传给 dva() 的 opts.initialState。//state

state: {

    user:{

        data:{

            code:null,

            data:[],

        }

    },

},

//以 key/value 格式定义 reducer。用于处理同步操作,唯一可以修改 state 的地方。由 action 触发,下面是由save触发。

reducers: {

    save(state, { payload }) {

        //保存数据到state

        return{

            state,

           //将payload数据放入user数组中

            user: payload,

        };

    },

},

//以 key/value 格式定义 effect。用于处理异步操作和业务逻辑,不直接修改 state。由 action 触发,可以触发 action,可以和服务器交互,可以获取全局 state 的数据等等。

effects: {

    *fetch({ payload }, { call, put }) {// eslint-disable-line

        //通过call执行initUserInf方法

        const response=yield call(initUserInf);

        //put触发reducers中的save方法,传入参数payload

        yield put({type:'save',payload:response});

    },

},

//以 key/value 格式定义 subscription。subscription 是订阅,用于订阅一个数据源,然后根据需要 dispatch 相应的 action。

subscriptions: {

    setup({ dispatch, history }){ // eslint-disable-line

    // 监听 history 变化,当路由为`/xx/xx` 时触发 `fetch` action

        returnhistory.listen(({ pathname, search }) => {

            if(pathname ==='/xx/xx) {

                //当条件满足的时候触发,路由==/my/myInf 执行fetch action,申明payload空数组

                dispatch({type:'fetch',payload: {} });

            }

        });

    },

},
上一篇下一篇

猜你喜欢

热点阅读