开启namespaced的Vuex模块中mapGetters自定义别名的正确语法是什么？

你的需求可以实现，正确语法如下：

正确写法1：直接传入完整getter路径（最简写法，适合单一场景） #

你只需要在mapGetters的对象参数中，把自定义别名作为键，把带命名空间的getter完整路径作为值即可，写法如下：

...mapGetters({
  // 左边：你要在组件中使用的别名，右边：store中getter的完整路径（模块名/原getter名）
  products: 'prods/products'
})

该写法和你手动编写的计算属性效果完全一致，模板中的调用代码不需要做任何修改。 #

正确写法2：使用命名空间辅助函数（适合同模块多getter映射场景） #

如果需要映射prods模块下的多个getter，可以先创建该模块的命名空间辅助函数，避免每次都重复写prods/前缀：

1. 先导入并创建命名空间辅助函数

import { createNamespacedHelpers } from 'vuex'
// 为prods模块创建专属的mapGetters辅助函数
const { mapGetters: mapProdsGetters } = createNamespacedHelpers('prods')

2. 映射时直接使用模块内的getter名即可

// 别名和原getter名一致时可以用数组写法
...mapProdsGetters(['products'])
// 需要自定义别名时用对象写法
...mapProdsGetters({
  customProductsAlias: 'products'
})

原有写法的错误原因 #

你之前的prod: 'prods', ['products']写法不符合mapGetters的参数规则：mapGetters的对象参数要求每个键值对都是「自定义别名: getter完整路径」的结构，不支持拆分模块名和getter名分开传入。

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