Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
122
rated 0 times [  127] [ 5]  / answers: 1 / hits: 6194  / 6 Years ago, tue, october 30, 2018, 12:00:00

I want to ask You how I can define a method which execute after the timeout? After that timeout i want to execute $emit event, but I don't know how can i do this...



<v-snackbar
v-model=snackbar
:color=primary
:timeout=5000
>
{{ text }}
<v-btn
dark
flat
@click=snackbar = false
>
Close
</v-btn>
</v-snackbar>


https://vuetifyjs.com/en/components/snackbars


More From » vue.js

 Answers
6

According to the documentation there's no event attached to that property, but i will give a solution that responds to your use case, add timeout property to your data object as follows :


   data() {
return {
snackbar:false,
timeout:6000,
....
}
}

add an event handler to your button click :


     <v-btn block
color="primary"
dark
@click="showSnackbar">
Show Snackbar
</v-btn>

in your methods add showSnackbar method


    methods: {
showSnackbar() {
this.snackbar=true;
setTimeout(() => { this.$emit("yourEvent"); },this.timeout);
}
}

I simulate a your case in this pen


[#10546] Monday, October 29, 2018, 6 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
lucianod

Total Points: 667
Total Questions: 106
Total Answers: 92

Location: Jordan
Member since Thu, Aug 5, 2021
3 Years ago
lucianod questions
Sat, Jul 25, 20, 00:00, 4 Years ago
Mon, Aug 27, 18, 00:00, 6 Years ago
;