本文共 1243 字，大约阅读时间需要 4 分钟。

1、专为Vue设计的状态管理模式，集中存储和管理应用程序中所有组件的状态

// index.jsimport Vue from 'vue'import Vuex from 'vuex'import user from './modules/user'import appConfig from './modules/appConfig'import addStrategy from './modules/addStrategy'Vue.use(Vuex)   //  Vue.use() 来安装使用 Vuexconst store = new Vuex.Store({  modules: {    user,    appConfig,    addStrategy  }})export default store// main.js 入口文件 引入 store 并注册到 vue 实例中import store from './data'new Vue({  el: '#app',  store,  router,  render: h => h(App)})// 在组件中使用①. 引入vuex中各属性对应的辅助函数// user.jsconst state = {userInfo:JSON.parse(sessionStorage.getItem(`userInfo`))||{},}; // 初始化的状态const mutations = {   // 处理状态  setUserInfo(state, userInfo) {   //保存用户登录信息    sessionStorage.setItem(`userInfo`, JSON.stringify(userInfo))    state.userInfo = userInfo;  },};const getters = {};const actions = {  updateUserInfo(context,value){    context.commit('setUserInfo',value) // 提交改变的状态  },};export default {  namespaced: true,  state,  getters,  mutations,  actions}import {mapActions, mapState,mapMutations} from 'vuex' //注册 action 、 state 、mutations②. 使用store中的状态、数据、方法 / 映射 store.state.countcomputed: {      ...mapState(`user`, [ `userInfo`]) }// 取值 this.userInfo

转载地址：https://blog.csdn.net/snow51/article/details/89017116 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！