Vuex中如何映射命名空间模块的响应式Getter？

假设你的Vuex模块已经开启了命名空间（模块定义中设置namespaced: true），要访问该模块的Getter，有两种修改方式：

方式一：直接指定带命名空间的Getter路径 #

在mapGetters的映射对象里，将Getter名称改为[模块名]/[Getter名]的格式，示例如下：

import { mapGetters } from 'vuex';

export default {
  computed: {
    ...mapGetters({
      // 假设模块名为user，目标Getter名为my-getter
      myGetter: 'user/my-getter'
    })
  }
}

方式二：传入命名空间前缀作为第一个参数 #

如果需要批量映射某个模块的多个Getter，可以把模块名作为mapGetters的第一个参数，后续的Getter名可省略模块前缀：

import { mapGetters } from 'vuex';

export default {
  computed: {
    // 假设模块名为user
    ...mapGetters('user', {
      myGetter: 'my-getter',
      // 可继续添加该模块的其他Getter映射
      anotherGetter: 'another-getter'
    })
  }
}

如果模块是嵌套结构（比如user/profile），只需把命名空间路径写全即可，比如'user/profile/my-getter'，或者将'user/profile'作为第一个参数传入mapGetters。

内容的提问来源于stack exchange，提问作者Alpug Parker