目录
vuex中的解构赋值
实践中,我们会经常用到 ES2015 的 参数解构 (opens new window)来简化代码(特别是我们需要调用 commit 很多次的时候):
之前:
actions: { increment (context) { context.commit('increment') } }
之后
actions: { increment ({commit}) { commit('increment') } }
vuex中的 es6-对象扩展-属性简洁表达式
new Vue({ el: '#app', store })
vuex中的 es6-对象扩展-属性名表达式
ES6 允许字面量定义对象时,用表达式作为对象的属性名,即把表达式放在方括号内。
使用常量替代 mutation 事件类型在各种 Flux 实现中是很常见的模式。
// mutation-types.js export const SOME_MUTATION = 'SOME_MUTATION'
// store.js import Vuex from 'vuex' import { SOME_MUTATION } from './mutation-types' const store = new Vuex.Store({ state: { ... }, mutations: { // 我们可以使用 ES2015 风格的计算属性命名功能来使用一个常量作为函数名 [SOME_MUTATION] (state) { // mutate state } } })
vuex中的 es6-对象扩展-展开运算符
computed: { localComputed () { /* ... */ }, // 使用对象展开运算符将此对象混入到外部对象中 ...mapState({ // ... }) }
vuex中的 es6-模块化
import { mapState } from 'vuex';