这个路由跳转用到的是编程式跳转this.$router.push
两种写法:
第一种可以通过path来跳转goto('/find')
find是路由里边的路径
<span @click="goto('/find')">发现音乐</span>
<span @click="goto('/my')">我的音乐</span>
<span @click="goto('/part')">朋友</span>
通过goto来绑定一个方法 里边传参
methods:{
/*
编程式导航跳转this.$router.push
参数1:可以传入对象 {path,name}二选一进行跳转
如果是通过path跳转,可以直接把路径作为第一个参数
*/
goto(path){
this.$router.push({
path
})
}
}
倒计时3秒文章来源:https://www.toymoban.com/news/detail-654000.html
<template>
<div>
<p>{{countDown }}秒后跳转新的页面</p>
<!-- <h1>404页面</h1> -->
<img src="../assets/404.png" alt="">
</div>
</template>
<script>
export default {
data(){
return{
countDown:3
}
},
created(){
let timerId = setInterval(() =>{
this.countDown--
if(this.countDown === 0){
// 编程式跳转至首页
this.$router.push('/find')
clearInterval(timerId)
}
},1000)
}
}
</script>
第二种通过name来跳转页面 在路由里边多写一行 name属性;并 修改goto里边的参数,其他都一样
文章来源地址https://www.toymoban.com/news/detail-654000.html
goto(name){
this.$router.push({
name
})
}
到了这里,关于vue 发现页面找不到3秒后跳转到本页面的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!