关于vuex:vuex多种获取数据和调用方法的总结

1.获取state数据

1.一般获取:在computed属性中以一个函数的办法返回state中的数据

computed:{
cont(){
rteurn this.$store.state.num
}
}

2.胡子语法中获取state数据:

<p>{{$store.state.num}}</p>

3.函数辅助中获取state数据:在…mapstate(中传入一个字符串数组)

...mapstate(['num'])

4.modules拆分的模块,对象包着,键值对形式,值是箭头函数形式

...mapstate({num:state=>state.num})

2.调用mutation办法

1.一般调用store.commit()

//在组件中
store.commit('办法名')

2.函数辅助的调用,在…mapmutations中传入一个字符串办法名数组

//1.没有传参
...mapmutation(['add'])
//2.如果须要传参
在事件中
this.add(要传的参数)

3.modules拆分进去的模块化中调用,对象包着,键值对形式

...mapmutations({属性名:'文件夹名/办法名'})
//如果要传参,在事件中
this.属性名(要传的值)

3.调用actions办法

1.一般调用通过$store.dispatch()办法

//在vuex中
mutations:{
getadd(state,payoad){
state.num=payoad
}
}
actios只是异步提交mutations办法
actions:{
add(context,payoad){
//异步代码
settimeout(()=>{
//提交mutations,通过commit
comtext.commit('mutations办法名',payoad)
},1000)
}
}

//在组件中调用
this.$store.dispatch('异步办法名',要传的值)

2.函数辅助调用,给…mapactions传入一个字符串办法名数组

//1.没有传参
...mapactions(['异步办法名'])
//2.如果要传参,在事件中调用
this.异步办法名(要传的参数)

3.modules拆分进去的模块,对象包着,以键值对形式

...mapActions({属性名:'文件夹名/办法名'})
//如果要传参,在事件中
this.属性名(要传的值)