编程式跳转
首先先创建个按钮和事件并且绑定
然后我们点击按钮之后就执行代码最后执行跳转
全代码:
<template>
<div>
<!-- 标签式跳转 -->
<h2>标签式跳转</h2>
<router-link to="/">首页</router-link>
<router-link to="/helloword">helloword</router-link>
<router-link to="/about">about</router-link>
<br>
<!-- 编程式跳转 -->
<h2>编程式跳转</h2>
<button @click="gohelloword()">3s后切换到hell oword</button>
<!-- 占位符:被替换成对应组件 -->
</div>
</template>
<script>
export default {
methods:{
gohelloword(){
var number =3;
console.log(this);
//在后台找到router
// 在vue对象中有很多$开头的属性
// vue自带属性都是$开头的
// 定时器
setInterval(()=>{
number--;
console.log(number);
if(number==0) this.$router.push("/helloword");
},1000);
}
}
}
</script>
<style lang="scss" scoped>
</style>
上篇文章 :