美文网首页
React dva脚手架Model

React dva脚手架Model

作者: AcessCors | 来源:发表于2019-05-14 11:20 被阅读0次

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: {} });

            }

        });

    },

},

相关文章

网友评论

      本文标题:React dva脚手架Model

      本文链接:https://www.haomeiwen.com/subject/ghzjaqtx.html