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

Question

例如，如果我有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">

我到底想念什么？

Answer 1

您应该使用计算属性：

toFunc

和

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