Vuex：突变中的方括号是什么？

Question

我想知道为什么 Vuex 中使用突变值 \xe2\x80\x8b\xe2\x80\x8bar "[]"。

\n\n

类似的代码是什么""意思？

\n\n

export const SOME_MUTATION = \'SOME_MUTATION\'

\n\n

它只是函数的常量名称吗？如果是这样，我想知道为什么常量写在"[]".

\n\n

另外，当在计算或方法属性中使用时，我想知道为什么您要将以下代码传递为而["SOME_ACTION"]不是"SOME_ACTION".

\n\n

...mapActions(["SOME_ACTION"]),

\n\n

考试代码

\n\n

export const SOME_MUTATION = \'SOME_MUTATION\'\n\nimport Vuex from \'vuex\'\nimport { SOME_MUTATION } from \'./mutation-types\'\n\nconst store = new Vuex.Store({\n  state: { ... },\n  mutations: {\n    [SOME_MUTATION] (state) {\n    }\n  }\n})\n

\n

Answer 1

它称为计算属性名称。这不是 Vuex 的事情。这是 ECMAScript 2015 的事情。因此任何支持 ES2015 的引擎都将支持该语法。

在 ES2015 之前，无法计算对象属性名称。这意味着如果您想要一个动态属性名称，您可能会编写如下内容：

const obj = {};
const result = Math.random() < 0.5;

if (result)
  obj.data = result;
else
  obj.error = result;
  
console.log(obj);

使用 ES2015 计算属性，您现在可以执行以下操作：

const result = Math.random() < 0.5;
const SOME_PROPERTY = result ? 'data' : 'error';

const obj = {
  [SOME_PROPERTY]: result
}

console.log(obj);

当然，这只是一个非常简化的示例，并没有真正展示它带来的好处，但在我看来，这是一个非常好的语法糖。

您可以在线找到有关其用例的更多信息。