I'm working with BootstrapVue.
I have - I think - a very simple question, but I could not find anything that worked for me. I have a <b-button> which I want to click and than the second <div> should be shown but only for 3 Seconds.
I want to have my code without jQuery - how can I achieve that?
Thank You!
<div class="row mb-3">
<div class="col-8 col-md-6 mt-4 ml-1">
<b-button @click="clickIt()"</b-button>
</div>
<div class="col-2 col-md-5 mt-4">
<p>You've clicked it!</p>
</div>
</div>
I hope this should resolve your problem.
<div class="row mb-3">
<div class="col-8 col-md-6 mt-4 ml-1">
<b-button @click="clickIt()"</b-button>
</div>
<div v-if="isClicked" class="col-2 col-md-5 mt-4">
<p>You've clicked it!</p>
</div>
</div>
export default {
data: () => {
return { isClicked: false };
},
methods: {
clickIt() {
this.isClicked = true
setTimeout(() => {
this.isClicked = false;
}, 3000);
},
},
};