|
參考： vuex官方文檔
Vuex快速使用 https://mp.weixin.qq.com/s/OnVcgBQlSLHiR12WXN5nbQ
模塊化用到的 require.context https:///post/6844903583113019405
vue element admin教程 https:///post/6844903840626507784#heading-29
在vue-element-admin中，已模塊化
例如，要新增routePoint.js src/store/getter.js const getters = {
sidebar: (state) => state.app.sidebar,
size: (state) => state.app.size,
device: (state) => state.app.device,
visitedViews: (state) => state.tagsView.visitedViews,
cachedViews: (state) => state.tagsView.cachedViews,
token: (state) => state.user.token,
avatar: (state) => state.user.avatar,
name: (state) => state.user.name,
userId: (state) => state.user.userId,
nickName: (state) => state.user.nickName,
introduction: (state) => state.user.introduction,
roles: (state) => state.user.roles,
permission_routes: (state) => state.permission.routes,
errorLogs: (state) => state.errorLog.logs,
// 新增
lastRoutePointListObj: (state) => state.routePoint.lastRoutePointListObj,
};
export default getters;
src/store/modules/routePoint.js import {
getRouteRealTimeNumber,
} from '@/api/route';
const state = {
lastRoutePointListObj: {
data: [],
timestamp: '',
},
};
const mutations = {
SET_LAST_ROUTE_POINT_LIST_OBJ: (state, lastRoutePointListObj) => {
const { data, timestamp } = lastRoutePointListObj;
state.lastRoutePointListObj.data = data;
state.lastRoutePointListObj.timestamp = timestamp;
},
};
const actions = {
setLastRoutePointListObj({ commit }, lastRoutePointListObj) {
commit('SET_LAST_ROUTE_POINT_LIST_OBJ', lastRoutePointListObj);
},
};
export default {
namespaced: true,
state,
mutations,
actions,
};
在組件xx.vue中使用 // 賦值
this.$store.dispatch("routePoint/setLastRoutePointListObj", {
data: [1,2,3],
timestamp: new Date().getTime(),
});
// 獲取值
console.log(this.$store.getters.lastRoutePointListObj)
|
|
|
