Vuex 突变:使用 ES6 语法解构状态参数(使用 quasar 框架)

Posted

技术标签:

【中文标题】Vuex 突变:使用 ES6 语法解构状态参数(使用 quasar 框架)【英文标题】:Vuex mutation: deconstruct state parameter using ES6 syntax (using quasar framework) 【发布时间】:2019-02-11 15:10:11 【问题描述】:

我有两种不同的语法。我可以使用 mapGetters() 和 mapActions() 访问我的 getter 和我的操作。第一个不解构状态参数并且有效。第二个确实解构了状态,但突变不会改变状态,而 getter 可以访问状态并且操作在解构上下文时没有问题。

我不明白为什么。 我会误用 ES6 / vuejs / vuex / quasar 吗?

Vue.use(Vuex)

export default new Vuex.Store(
  state: 
    counter1: 0,
    counter2: 0
  ,
  getters: 
    counter1: state => state.counter1,
    counter2: ( counter2 ) => counter2
  ,
  mutations: 
    increment1: state => state.counter1++,
    increment2: ( counter2 ) => counter2++
  ,
  actions: 
    increment1: context => context.commit('increment1'),
    increment2: ( commit ) => commit('increment2')
  
)

【问题讨论】:

您只是在增加 局部变量,而不是对象属性。 【参考方案1】:

我的一个朋友给了我答案。我误用了 ES6。

counter2 不引用 state.counter2,而是复制它。

更改 counter2 时无法更改 state.counter2 是有道理的。

【讨论】:

以上是关于Vuex 突变:使用 ES6 语法解构状态参数(使用 quasar 框架)的主要内容,如果未能解决你的问题,请参考以下文章

ES6解构赋值有这一篇就够了

ES6中新语法:解构

Vue,错误 [vuex] 不会在突变处理程序之外改变 vuex 存储状态

ES6入门之变量的解构赋值

不使用突变直接改变 Vuex 状态

高级JavaScript第篇