直接从模板更改Vuex变量的状态

时间:2018-08-28 07:52:10

标签: vue.js vuex

例如,如果我有Vuex设置,如下所示:

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    dialog: false
  },
  mutations: {
    openTermsAndConditions (state) {
      state.dialog = true
    }
  },
  actions: {

  }
})

我可以发出一个使dialog变量发生突变的事件,但是,由于我的模板如下所示,似乎什么也没有发生:

<v-dialog v-model="dialog" transition="dialog-bottom-transition">

所以,我的问题是,如何绑定对话框的存储值而不是本地定义的变量?

我尝试了以下方法,但是没有运气:

<v-dialog v-model="$this.store.dialog" transition="dialog-bottom-transition">

...和...

<v-dialog v-model="$this.state.dialog" transition="dialog-bottom-transition">

我到底想念什么?

1 个答案:

答案 0 :(得分:1)

您应该使用计算属性:

toFunc

computed: { dialog: { get () { return this.$store.state.dialog }, set () { this.$store.commit('openTermsAndConditions') } } }