dictionary - 在 Vuex 状态中使用 Map

Question

我正在构建一个原型(prototype)模块来了解 Vuex 并遇到了一个看似简单的问题——我在使用 Map 时遇到了问题作为我的状态变量之一。

我想使用 Vuex 跨多个模块存储一些基本的用户偏好并计算出 Map将是一种简单的方法，因为首选项可以作为简单的键/值对处理。但我要么没有定义 Map正确，或者我没有在突变中正确使用它。

<script lang="ts">
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    userSettings: Map,
  },
  mutations: {
    addUserSetting(state, payload) {
      if (state.userSettings == null) {
        state.userSettings = new Map();
      }
      state.userSettings.set(payload.key, payload.value);
    }

  },

})


</script>

我愿意使用另一个对象，我从 UserPref 的数组开始。对象，但也不顺利。

Answer 1

Vue 2 没有对 Map 的适当支持.

假设您的键是字符串，我建议使用 Object 代替。要获得一个完全空的对象(没有继承属性，甚至没有 toString )，您可以使用 Object.create(null) , 或者只是使用 {} 的普通对象如果这似乎没有必要。

例如

import Vue from 'vue'

export default new Vuex.Store({
  state: {
    userSettings: Object.create(null),
  },
  mutations: {
    addUserSetting(state, payload) {
      Vue.set(state.userSettings, payload.key, payload.value);
    }
  }
})

Vue.set必须在添加属性时使用。