javascript - Vuex:变异中的方括号是什么意思?

标签 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) {
    }
  }
})

最佳答案

它被称为 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);

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

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

关于javascript - Vuex:变异中的方括号是什么意思?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56553341/

相关文章:

javascript - Vuex 动态模块没有命名空间

vue.js - 如何修复此错误 [Vue 警告] : Unknown custom element: <nuxt-link> in unit testing with Jest

javascript - Mocha - 运行和解析两个异步/等待调用

javascript - TypeScript 类装饰器创建与构造函数具有相同类型参数的方法

Javascript - 平面 map 的解决方法

javascript - 确保模态始终居中

javascript - Sublime Text 3 中 x-template 脚本标签内 HTML 的语法高亮显示

javascript - 从 Angular js 资源获取数据

javascript - Knock out js - 根据选择控件中选择的选项绑定(bind)值

javascript - 从隐藏的输入中检索 JSON 数据