vue 发现页面找不到3秒后跳转到本页面

这篇具有很好参考价值的文章主要介绍了vue 发现页面找不到3秒后跳转到本页面。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

vue 发现页面找不到3秒后跳转到本页面,vue,vue.js,javascript,前端
这个路由跳转用到的是编程式跳转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秒

<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里边的参数,其他都一样
vue 发现页面找不到3秒后跳转到本页面,vue,vue.js,javascript,前端文章来源地址https://www.toymoban.com/news/detail-654000.html

 goto(name){
            this.$router.push({
                name
            })
        }

到了这里,关于vue 发现页面找不到3秒后跳转到本页面的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue跳转到其他页面

    一、无参跳转 跳转到指定URL,向history栈添加一个新的纪录,点击后退会返回至上一个页面。 二、带参跳转 1、query传参 query传递的参数显示在地址栏中,刷新后依然存在,类似 参数接收方式 或者放到 created 里面 或者放到 mounted 里面 以上几种写法都是可以的。特别注意参数

    2024年02月13日
    浏览(42)
  • 帝国CMS商城提交订单后跳转到订单列表页的实现方法

    帝国CMS商城提交订单后默认返回购物车页面,但订单已经提交了,购物车基本上是空空如也,所以更希望提交订单后跳转到订单列表页查看订单。 打开 e/ShopSys/class/ShopSysFun.php 这个文件, 找到:(约534行) $location=\\\"buycar/\\\"; 修改为: $location=\\\"ListDd/\\\"; 不想改文件可以参考:htt

    2024年02月03日
    浏览(62)
  • vue点击按钮实现跳转到另一个vue页面

    首先需要对按钮绑定一个函数,然后在函数里进行页面路由的改变。 这里要确保项目中已经在使用vue-router。 如图,我想要跳转到这个index.vue页面 那么按钮绑定的函数里的路径应该这么写: 然后需要在router文件夹下的index.js里进行该页面的注册: 最主要的是我红框里的内容

    2024年02月16日
    浏览(55)
  • uniapp项目编译成H5后跳转到微信小程序(支持微信扫码、支付宝扫码)

    uniapp项目编译成 H5 后跳转到 微信小程序 (支持微信H5、支付宝H5) 场景:1、微信扫码跳转到该H5中后点击某事件(或者不点击直接跳转)需要跳转到微信小程序;2、支付宝扫码跳转到H5中后点击某事件(或者不点击直接跳转)需要跳转到微信小程序 思路:调用后端接口返回

    2024年02月13日
    浏览(56)
  • 前端vue项目:生成二维码,扫二维码跳转到相应页面

    Vue2项目 1、安装依赖::npm i arale-qrcode --save 2、引入:import AraleQRCode from \\\"arale-qrcode\\\"; 接下来让我们纯前端生成一个二维码                               【PS:亲测有效,大家可以放心使用 CV 大法哈  !】 HTML JS 需求中遇到的情况,也是百度了很久参考了很多大佬的文章

    2024年02月07日
    浏览(58)
  • 若依框架登录后跳转其他页面&获取不同的菜单&登录进入后跳转至动态路由的第一个路由

    最近碰到的需求是登录进入后,先跳转至一个自己定义的页面,在这个页面选择一个系统后,进入若依的系统,根据选择的系统获取相应的菜单,进入页面后默认跳转至后端返回的动态路由的第一个路由 1.首先在登录页面login.vue做如下改动 写成你要跳转过去的页面:(这个路由如果是

    2024年02月01日
    浏览(54)
  • vue页面动态生成二维码,扫描二维码跳转到微信小程序,同时传递参数

    最近领导提了个新的需求, 点击表格时,弹出一个二维码,微信扫描此二维码时,跳转到微信小程序,同时将所在行的id(即员工所在公司的id)传过去,这样员工在登录微信小程序时,根据此id就知道是哪个公司的员工登录或者注册 了! 刚开始想的是,直接把小程序的二维

    2024年02月11日
    浏览(82)
  • js做简单的登录页面以及附加条件,登录成功后跳转

    新手第一次上传,还不会介绍,很简单,能看懂不难的   成功后跳转页面代码就更简单了  

    2024年02月11日
    浏览(48)
  • uniapp 获取手机定位权限及禁止拒绝后跳转设置页面

    问题:获取手机定位权限,在用户点击拒绝后,再次点击定位按钮,手机无反应。这里,安卓系统2次拒绝之后,默认为禁止询问弹窗弹出,所以再点击定位肯定没有反应。 一、解决思路:第一想到,检查是否打开GPS功能(Android),打开了直接跳转到地图定位页面,关闭状态

    2024年02月03日
    浏览(50)
  • dede织梦自定义表单提交成功后跳转页面实现方法

    今天我们碰到一位客户,想要完成织梦表单提交后,跳转到一个页面显示:已提交成功,请耐心等待回复。处理到这里,我们想到了这个功能还是很容易完成的,需要对plus/diy.php处理提示页面。 修改方法 默认的是:“发布成功,请等待管理员处理...”,默认跳转页面是网站

    2024年02月03日
    浏览(100)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包