单击几秒钟后如何显示 div
how to show div after click only for few seconds
我正在与 BootstrapVue
合作。
我有 - 我认为 - 一个非常简单的问题,但我找不到任何适合我的问题。我有一个 <b-button>
我想点击,第二个 <div>
应该显示但只显示 3 秒。
我想让我的代码 没有 jQuery - 我该如何实现?
谢谢!
<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>
希望这能解决您的问题。
<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);
},
},
};
我正在与 BootstrapVue
合作。
我有 - 我认为 - 一个非常简单的问题,但我找不到任何适合我的问题。我有一个 <b-button>
我想点击,第二个 <div>
应该显示但只显示 3 秒。
我想让我的代码 没有 jQuery - 我该如何实现?
谢谢!
<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>
希望这能解决您的问题。
<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);
},
},
};