24.10.16

学习Vue项目的文件结构。
配置Vue Router和Vuex。

const userModule = {
  state: {
    users: [], // 用户列表
    currentUser: null, // 当前选中的用户
    userRole: 'guest', // 当前登录用户角色
  },
  mutations: {
    setUsers(state, users) {
      state.users = users;
    },
    setCurrentUser(state, user) {
      state.currentUser = user;
    },
    setUserRole(state, role) {
      state.userRole = role;
    },
  },
  actions: {
    async fetchUsers({ commit }) {
      const response = await fetch('/api/users');
      const users = await response.json();
      commit('setUsers', users);
    },
    async fetchUserById({ commit }, userId) {
      const response = await fetch(`/api/users/${userId}`);
      const user = await response.json();
      commit('setCurrentUser', user);
    },
  },
  getters: {
    isAdmin(state) {
      return state.userRole === 'admin';
    },
  },
};

export default userModule;