vuex状态管理模式
文章已阅读次
Vuex是一个专为 Vue.js 应用程序开发的状态管理模式 + 库,其结构：
State：定义存储状态对象
Getter:获取到State后，对其计算返回需要的值（获取计算状态对象）
Mutation：提交更新状态对象（同步，异步使用：Action）
Action:提交一个或多个Mutation，不是直接变更状态
Module:模块化vuex，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。
- 定义（在main.js中）2.提交状态对象
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17const store = new vuex.Store({
state: {
orderlist: {},
},
mutations: {
setOrderValue(state, orderlist) {
state.orderlist = orderlist
},
},
getters: {
getOrderValue: state => state.orderlist,
},
actions: {
},
modules: {
}
})3.获取状态对象1
this.$store.commit("setOrderValue", "要提交的数据");
需要注意的是状态对象信息在页面刷新后就不存在了。1
var orderLists= this.$store.getters.getOrderValue;