1. 前言

1. 最近找工作 遇到了一些有意思的面试题记录下来
2. vuex 2 个模块之间修改数据,这个平常开发 确实没用到,而且也破坏了vuex单向数据流的原则,可能导致数据状态管理的混乱
3. 但是既然问了应该就有解决办法 所以简单写下

---

2. 条件

1. vuex 中 有user 和 common 2 个模块

---

3. comm 模块

// common.js (common module)
const state = {
  dataToBeModified: '',
};

const mutations = {
  SET_DATA(state, payload) {
    state.dataToBeModified = payload;
  },
};

export default {
  namespaced: true,
  state,
  mutations,
};

---

4. user 模块

1. 在user模块的actions中，使用commit来触发common模块的mutations
2. 从而修改common模块的数据。

// user.js (user module)
const actions = {
  updateUserCommonData({ commit }, payload) {
    commit('common/SET_DATA', payload, { root: true });
  },
};

export default {
  namespaced: true,
  actions,
};

---

5. 组件使用

import { mapActions } from 'vuex';

export default {
  // Component options...

  methods: {
    ...mapActions('user', ['updateUserCommonData']),
    updateCommonData() {
      this.updateUserCommonData('New data'); 
    },
  },
};

---

参考资料

---

初心

我所有的文章都只是基于入门，初步的了解；是自己的知识体系梳理,如有错误,道友们一起沟通交流;

如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;

共勉