Как закрыть модальное состояние в vue

Question

Я использую компонент v-dialog. Я могу открыть v-диалог по состоянию, но не могу закрыть, когда нажимаю кнопку закрытия, которая должна получить значение false

Вот мой код

<v-dialog :value="productSellingStatus" persistent max-width="290">
      <v-card>
        <v-card-title class="headline">Use Google's location service?</v-card-title>
        <v-card-text>Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.</v-card-text>
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn color="green darken-1" text @click="!productSellingStatus">Disagree</v-btn>
          <v-btn color="green darken-1" text @click="this.dialog=!productSellingStatus">Agree</v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>


//in script 
computed: {
        ...mapState(["productSellingStatus"]) 

Я могу открыть модальный режим, когда мое состояние productSellingStatus станет истинным при мутации

Answer 1

У вас должна быть мутация в хранилище Vuex ...

    [TOGGLE_SELLING_STATUS] (state, bool) {
        state.productSellingStatus = bool
    },

, а затем переключить ее из метода в компоненте ...

toggleSellingStatus (val) {
  this.$store.commit('TOGGLE_SELLING_STATUS', val)
},

Answer 2

Вы также можете напрямую использовать $ store.

$store.state.productSellingStatus=false

<v-btn color="green darken-1" text @click="this.dialog=!$store.state.productSellingStatus">Agree</v-btn>