通过控制div的高,来模拟淡出效果
<button @click="handleClick">点击淡出</button>
<div id="div3" style="width:80px;height:0px;background-color:pink;overflow:hidden;line-height:80px;">
啦啦啦啦
</div>
handleClick(){
let div = document.querySelector("#div3")
let t = 0;
//设置定时器
let timer = setInterval(()=>{
//每隔0.01秒div的高加1
t+=1
div.style.height = t+'px'
//当高为80px时清除定时器
if(t==80){
clearInterval(timer)
}
},10)
},