vuex 直接修改state、commit 和dispatch 修改state 的用法及区别
vuex 直接修改state、commit 和dispatch 修改state 的用法及区别1)可以直接使用 this.$store.state.变量 = xxx;2)通过commit修改stateimport Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({state: {name:
·
1、vuex 直接修改state、commit 和dispatch 修改state 的用法及区别
1)可以直接使用 this.$store.state.变量 = xxx;
2)通过commit修改state
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
name:''
},
mutations: {//类似method
SET_NAME(state, name) {
state.name = name;
}
}
使用:commit提交触发mutations里方法
this.$store.commit("SET_NAME", 'xlt');
3)通过dispatch修改state
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
name:''
},
mutations: {//类似method
SET_NAME(state, name) {
state.name = name;
}
},
actions: {//类似method
set_name({ commit }, name) {
commit('SET_NAME', name)
}
}
使用:dispatch提交触发actions里方法
this.$store.dispatch("set_name", 'xlt');
2、区别:
1)commit方式是同步操作,dispatch方式是异步操作
3、总结:
1)都可以修改state里的变量,并且是响应式的(能触发视图更新)
更多推荐
已为社区贡献3条内容
所有评论(0)