Vuex:什么是方括号突变?

时间:2019-06-12 00:54:14

标签: javascript vue.js ecmascript-6 vuex

我想知道为什么在Vuex的"[]"中使用了突变值。

""这样的代码是什么意思?

export const SOME_MUTATION = 'SOME_MUTATION'

这只是函数的常量名称吗?如果是这样,我想知道为什么将常量写在"[]"中。

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

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

考试代码

export const SOME_MUTATION = 'SOME_MUTATION'

import Vuex from 'vuex'
import { SOME_MUTATION } from './mutation-types'

const store = new Vuex.Store({
  state: { ... },
  mutations: {
    [SOME_MUTATION] (state) {
    }
  }
})

1 个答案:

答案 0 :(得分:3)

它称为computed property name。这不是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);

当然,这只是一个非常简化的示例,并没有真正说明它带来的好处,但是在我看来,这是一个非常不错的语法摘要。

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