VueX Module:路过你,忘记你

0. 缘起

忘了vuex里面的module咋用的了

1. 官网文档

Module | Vuex (vuejs.org)

2. 拆分使用

2.1 vuex 文件夹下 index.js

import Vue from 'vue'
import Vuex from 'vuex'
import getters from './getters'

import WWUser from './module/WWUser'

import {state} from './store'
import { mutations} from './mutations'
Vue.use(Vuex)

export default new Vuex.Store({
  state,
  mutations,
  modules: {
    WWUser,
  },
  getters
})

2.2 module文件夹下的WWUser.js

export default {
    namespaced: true,	//使用命名空间,这样只在局部使用
    state: () => ({
        WWUserInfo: {}
    }),
    mutations: {
        SET_USER: (state, data) => {
            state.WWUserInfo = data;
        }
    },

}

2.3 在login.vue中使用SET_USER

        this.$store.commit("WWUser\SET_USER", res.data.userInfo);

附录

vuex之module的使用 - iveBoy - 博客园 (cnblogs.com)

posted @ 2022-02-09 18:03  乐盘游  阅读(24)  评论(0编辑  收藏  举报