效果如下
image.png
上代碼
html代碼
<h2>
<span style="color: #1890FF"> {{ time }} </span
>秒后自動(dòng)跳轉(zhuǎn)
</h2>
data() {
return {
// 初始化0
time: 0,
};
},
methods: {
// 封裝一個(gè)方法
countDown() {
let THIS = this;
THIS.time--;
},
},
mounted() {
let THIS = this;
// 把time改為5
THIS.time = 5;
// 設(shè)定一個(gè)定時(shí)器玻侥，每一秒調(diào)用一次coundDown方法篙顺，time-1
setInterval(THIS.countDown, 1000);
},
watch: {
// 監(jiān)聽(tīng)time的值
time: function (newVal) {
if (newVal == 0) {
this.$router.push("/login");
}
},
},
};
