Vuex

介绍

Vuex 同样实现了自动注册,开发只需关注 @/store/modules/ 文件夹里的文件即可,请根据模块区分文件。

目录结构

├── store                  # 全局 store 管理
│   ├── modules            # store 文件
│       ├── menu.js        # 生成导航菜单的路由数据,不建议修改此文件。
│       ├── setting.js     # 存放配置相关数据,不建议修改此文件。
│       ├── user.js        # 负责实现用户的登录、登出,以及用户信息处理。
│   ├── index.js           # 自动注入全局组件
1
2
3
4
5
6

新建模版:

// user.js
const state = {};
const getters = {};
const actions = {};
const mutations = {};
export default {
  namespaced: true,
  state,
  actions,
  getters,
  mutations,
};
1
2
3
4
5
6
7
8
9
10
11
12

文件默认开启命名空间,文件名会默认注册为模块名,使用方法:

this.$store.state.user.xxx;
this.$store.getters["user/xxx"];
this.$store.dispatch("user/xxx");
this.$store.commit("user/xxx");
1
2
3
4

user

负责实现用户的登录、登出,以及用户信息处理。

注意

这个文件是需要二次开发的,应根据自身项目需求来修改对应的代码。