// 购物车模块 export default { state:{//存放状态 // 底部导航的高 footHeight:'', token:'token已生成', userInfo:{}, count:0, publicColor:'', todos: [{ id: 1, text: '我是内容一', done: true }, { id: 2, text: '我是内容二', done: false } ], obj:{ a:'吃鸡腿', b:'吃自助餐' }, titleList:[], imgList:[], onLineList:[], cartNum:0, geList:[] }, // Vuex中store数据改变的唯一方法就是mutations 不适合异步方法 mutations: { setNum(state,num){ state.cartNum = num; }, setGe(state,payload){ state.geList = payload.geList; }, footHeightEv(state,str){ state.footHeight = str; }, add(state) { state.count = 7; }, add2(state, payload) { state.count = payload.amount; }, // 单个属性处理方法 setToken(state,str) { state.token = str; }, // 对象处理方法 updateUserInfo(state, payload) { // 变更状态 state.userInfo = payload.userInfo; }, // 新增字段方法 newProp(state,payload) { state.obj = { ...state.obj, c: payload.c }; }, updateState(state, payload) { state.onLineList = payload.list; } }, // 可以执行任意的同步和异步操作 actions:{ addCountAction ({commit}) { commit('add') }, addCountAction2 (context , payload) { context.commit('add2', payload) }, // 异步方法 addCountAction3 (context , payload) { setTimeout(function () { context.commit('add2', payload) }, 2000) }, actionA ({ commit }) { return new Promise((resolve, reject) => { setTimeout(() => { commit('someMutation') resolve() }, 1000) }) }, actionB ({ dispatch, commit }) { return dispatch('actionA').then(() => { commit('someOtherMutation') }) } }, // Vuex 允许我们在 store 中定义“getter”(可以认为是 store 的计算属性),对 state 的加工,是派生出来的数据。 可以在多组件中共享 getter 函数,这样做还可以提高运行效率。 getters: { doneTodos: state => { return state.todos.filter(todo => todo.done) }, doneTodosCount: (state, getters) => { //state :可以访问数据 //getters:访问其他函数,等同于 store.getters return getters.doneTodos.length }, getTodoById: (state) => (id) => { return state.todos.find(todo => todo.id === id) } } }