Как изменить значение V-закусочной после тайм-аута

#vue.js #vuetify.js #vuex

Вопрос:

Я использую vuex и a snackbar.js и Закусочная.ву. Когда я нажимаю кнопку отправить из компонента, она активирует всплывающее значение в магазине vuex. Если PopUpDialog===true, то Snackbar.vue появится вверху. Но проблема в том, что, хотя закусочная исчезает после 2000duration, значение всплывающего окна остается верным. Следовательно, я больше не могу звонить в закусочную.

 <template>
   <v-snackbar
      :timeout="timeout"
      top
      :color=popup_type
      outlined
      right
    >
     {{popup_message}}
    </v-snackbar>
</template>
<script>
  import { mapGetters } from 'vuex'

  export default
  {
    data() 
    {
        return{        
          timeout:2000
        }
    },
   
    computed: mapGetters({     
      popup :'GETTER_POPUP_VALUE',      
      popup_message:'GETTER_POPUP_MESSAGE',
      popup_type:'GETTER_POPUP_TYPE'
    }),   
  }
</script>
<style>
</style>
 

Начиная с первого компонента, я называю закусочную так;

  <pop-up v-if="this.PopUpDialog === true"></pop-up>
 

И

 //HERE I call Snackbar
             this.$store.dispatch('SET_POPUP_VALUE',true);
             this.$store.dispatch('SET_POPUP_TYPE','error');
             this.$store.dispatch('SET_POPUP_MESSAGE','Listeleme için en az bir kriter girilmelidir. (140)');
 

Я не мог понять, КОГДА и ГДЕ я должен изменить значение PopUpDialog.

Ответ №1:

Я решил вот так;

 <template>
       <v-snackbar
          :timeout="timeout"
          top
          :value="popup"
          @input="snackbarClose"
          :color=popup_type
          outlined
          right
        >
         {{popup_message}}
        </v-snackbar>
    </template> 
    methods: {
          snackbarClose(val) {
            this.$store.dispatch("SET_POPUP_VALUE", val)
          }
        } 

 

Ответ №2:

Тебе нужна v-model закусочная.