Vuex的基本方法

1、Vuex是中心状态管理方案,Vuex里面的store相当于一个仓库,用来存储数据的。
2、const store = new Vuex.Store({
state:{}, //调用 this. s t o r e . s t a t e . m u t a t i o n s : , / / t h i s . store.state.属性名 mutations:{}, //this. store.commit(“方法名”,参数) 同步调用
getters:{}, //this. s t o r e . g e t t e r s ( " " ) a c t i o n : / / t h i s . store.getters("方法名",参数) action:{} //this. store.dispatch(“方法名”,参数) 异步调用
})
3、给对象添加新属性
Vue.set(obj,‘newprop’,123)
state.obj ={…state.obj,newprop:123}
4、只要store.state里面的值发生改变,就会立即触发更新相关联的dom,也会重新计算store.getters
5、使用mapState
import {mapState} from ‘vuex’
export default{
computed:mapState({
count:state=>state.count,
countAlias:‘count’ //state=>state.count
})
}
调用方法:this.count()相当于this. s t o r e . g e t t e r s ( ) 6 使 m u t a t i o n i m p o r t m a p M u t a t i o n f r o m v u e x e x p o r t d e f a u l t m e t h o d s : m a p M u t a t i o n ( [ i n c r e a m e n t , i n c r e a m e n t l y ] ) t h i s . i n c r e a m e n t ( ) t h i s . store.getters() 6、使用常量代替mutation事件类型 import {mapMutation} from 'vuex' export default{ methods:{ mapMutation([ 'increament','increamently' ]) } } 调用方法:this.increament()相当于this. store.commit()
7、分发action 使用store.dispatch
action提交给mutation,mutation更改state值

猜你喜欢

转载自blog.csdn.net/qq_39039128/article/details/83067844
今日推荐