Vuex语法糖
vuex
import {
token
} from '@/config/AppParameter.js';
/* 用户信息 */
const state = {
UserInfo: {}, //用户信息
accessToken: uni.getStorageSync(token) || '', //token
DayList: []
};
const getters = {
ReturnAccessToken(state) {
return state.accessToken;
},
ReturnUserInfo(state) {
return state.UserInfo;
}
};
const mutations = {
UpdateaccessToken(state, token) {
state.accessToken = token;
},
UpdateUserInfo(state, userInfo) {
state.UserInfo = userInfo;
}
};
const actions = {
SUpdateaccessToken(ctx, token) {
ctx.commit('UpdateaccessToken', token);
},
SUpdateUserInfo(ctx, userinfo) {
ctx.commit('UpdateUserInfo', userinfo);
},
};
export default {
namespaced: true,
state,
getters,
mutations,
actions
};
index.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
import man from './modules/man.js';
import user from './modules/user.js';
const store = new Vuex.Store({
modules:{
man,
user
}
});
export default store;
获取
import {
mapState
} from "vuex"
//计算属性监听
computed: {
//扩展运算符,深拷贝,拿到值
...mapState({
UserInfo: state => state.user.UserInfo,
StoreDataList: state => state.user.StoreDataList,
DayList: state => state.user.DayList
})
},
vuex的语法糖还包括
mapGetters, mapActions, mapMutations
,语法一致,一般使用mapState
就足够了