dva model

原文:https://blog.csdn.net/lizhen_software/article/details/79455150vue

一、model至关于vue的vuex,里面包含了但向数据流的全部的控制react

二、在vue中咱们通常定义一个全局的头部标题字段,而且在mounted中调dispatch改变,但在dva的model中这段分为了两个部分,其中effects是异步修改数据时调用的, 也就是在react的componentDidMount的生命周期里面须要调用的是异步的effects的action,但若是是用户操做的某个方法是,能够直接调用reducers里面的actionvuex

三、注意若是在组件中要调用dispatch的话,必须导入connect,而且注入,才能够调用,否则会报不存在的方法浏览器

四、dva规定比较强制,若是你是异步的方法必须调用effects的action,绝对不能调用同步的reducers,不然会报错,但同步的操做能够调用异步的effects,但由于是异步的操做,数据有时不会直接变过来,若是是操做的话,建议用reducers的同步异步

五、2中说effects改变数据时不能直接修改state,要不直接用dispatch改变reducers中的某个值,要不直接将修改put进去,代码以下:this

const state = () => ({
topTitle: "个人名字"
});
export default {
namespace: 'user',
state: state(),
effects: {
* getUserList({ payload, request }, { put, titleName }) {
console.log(payload)
yield put({
type: 'update',
payload: {
topTitle: payload.titleName
}
});
}
},
reducers: {
update( state, action ) {
return { ...state, ...action.payload };
}
}
};

 

componentDidMount() {// 改变标题的名字
this.props.dispatch({ type: 'user/getUserList',payload: {
titleName:'订单详情'
}});
}

数据流向

数据的改变发生一般是经过用户交互行为或者浏览器行为(如路由跳转等)触发的,当此类行为会改变数据的时候能够经过 dispatch 发起一个 action,若是是同步行为会直接经过 Reducers 改变 State ,若是是异步行为(反作用)会先触发 Effects 而后流向 Reducers 最终改变 Statespa

相关文章
相关标签/搜索