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

news/2024/5/16 11:08:54/文章来源:https://blog.csdn.net/qq_48203828/article/details/132308081

在这里插入图片描述
这个路由跳转用到的是编程式跳转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里边的参数,其他都一样
在这里插入图片描述

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_345603.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

单片机如何分散加载文件

本篇文章将通过实际操作介绍如何实现分散加载文件的方法。开发工具为&#xff1a;mdk&#xff1b;开发板&#xff1a;野火stm32f407 一、建立工程 通过实现简单的加法计算的软件算法&#xff0c;来了解分散加载image 的方法。 建立工程&#xff0c;创建文件夹以及相应的文件&am…

【boost网络库从青铜到王者】第三篇:asio网络编程中的buffer缓存数据结构

文章目录 1、关于buffer数据结构1.1、简单概括一下&#xff0c;我们可以用buffer() 函数生成我们要用的缓存存储数据。1.2、但是这太复杂了&#xff0c;可以直接用buffer函数转化为send需要的参数类型:1.3、output_buf可以直接传递给该send接口。我们也可以将数组转化为send接受…

PyQt5资源的加载和使用,即如何使用Pyrcc

1、打开QtDesigner&#xff0c;选择编辑资源 2、新建资源文件&#xff0c;随便找个地方保存 3、按照自己的喜好命名&#xff0c;然后添加资源 4、保存并退出 5、我们创建一个QLabel&#xff0c;在这里添加资源 6、我们保存界面文件&#xff0c;并编译为py文件&#xff0c;然后…

SpringBoot + Mybatis多数据源

一、配置文件 spring: # datasource: # username: root # password: 123456 # url: jdbc:mysql://127.0.0.1:3306/jun01?characterEncodingutf-8&serverTimezoneUTC # driver-class-name: com.mysql.cj.jdbc.Driverdatasource:# 数据源1onedata:jdbc-url: j…

【5款登录验证校验】基于jquery实现的5款登录验证码组件(附完整源码)

文章目录 写在前面涉及知识点1、随机字母验证码1.1 效果1.2 实现源码 2、数字运算验证码2.1 效果2.2 实现源码 3、滑块验证码3.1 效果3.2 实现源码 4、图片补全验证码4.1 效果4.2 实现源码 5、顺序点选验证码5.1 效果5.2 实现源码 6、源码分享6.1 百度网盘6.2 123网盘6.3 邮箱留…

基于STM32的超声波雷达

视频地址:1.基于STM32的超声波雷达-演示_哔哩哔哩_bilibili 备注:文档最后有所有文件的网盘地址 1. 项目展示 1.1. 最终效果 1.2. 项目硬件 全部必要硬件(左到右): ST-LINK调试器:调试下载程序stm32f103c8t6核心板1.8寸TFT显示器sg90舵机超声波传感器

Cpp学习——string模拟实现

目录 一&#xff0c;string的成员变量 二&#xff0c;string的各项功能函数 1.构造函数 2.析构函数 3.扩容函数 4.插入与删除数据的函数 5.运算符重载 6.打印显示函数 7&#xff0c;拷贝构造 8.find函数 一&#xff0c;string的成员变量 在模拟实现string之前&#xff…

k8s 自身原理之 Service

好不容易&#xff0c;终于来到 k8s 自身的原理之 关于 Service 的一部分了 前面我们用 2 个简图展示了 pod 之间和 pod 与 node 之间是如何通信息的&#xff0c;且通信的数据包是不会经过 NAT 网络地址转换的 那么 Service 又是如何实现呢&#xff1f; Service 我们知道是用…

mysql-事务特性以及隔离机制

一.ACID 事务&#xff08;Transaction&#xff09;是访问和更新数据库的程序执行单元&#xff1b;事务中可能包含一个或多个sql语句&#xff0c;这些语句要么都执行&#xff0c;要么都不执行。 1.逻辑架构和存储引擎 如上图所示&#xff0c;MySQL服务器逻辑架构从上往下可以分…

麦肯锡发布《2023年度科技报告》!

在经历了 2022 年技术投资和人才的动荡之后&#xff0c;2023 年上半年&#xff0c;人们对技术促进商业和社会进步的潜力重新燃起了热情。生成式人工智能&#xff08;Generative AI&#xff09;在这一复兴过程中功不可没&#xff0c;但它只是众多进步中的一个&#xff0c;可以推…

vue 路由地址把#去掉

在路由对象里边添加history模式就不显示# mode:history // 4.通过规则创建对象 const router new VueRouter({routes,// 默认模式为hash 带# // history 不带#mode:history })想把端口号8000换成其他的 比如我这样的3000更换端口号教程

自动化测试用例设计实例

在编写用例之间&#xff0c;笔者再次强调几点编写自动化测试用例的原则&#xff1a; 1、一个脚本是一个完整的场景&#xff0c;从用户登陆操作到用户退出系统关闭浏览器。 2、一个脚本脚本只验证一个功能点&#xff0c;不要试图用户登陆系统后把所有的功能都进行验证再退出系统…

【声波】声波在硼酸、硫酸镁 (MgSO4) 和纯水中的吸收研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

部署工业物联网可以选择哪些通信方案?

部署工业物联网有诸多意义&#xff0c;诸如提升生产效率&#xff0c;降低管理成本&#xff0c;保障生产品质稳定&#xff0c;应对长期从业劳动力变化趋势等。针对不同行业、场景&#xff0c;工业物联网需要选择不同的通信方案&#xff0c;以达到成本和效益的最佳平衡。本篇就简…

05-基础入门-系统及数据库等

基础入门-系统及数据库等 一、操作系统层面1、识别操作系统常见方法2、简要两者区别及识别意义3、操作系统层面漏洞类型对应意义4、简要操作系统层面漏洞影响范围 二、数据库层面1、识别数据库类型常见方法2、数据库类型区别及识别意义3、数据库常见漏洞类型及攻击4、简要数据库…

无涯教程-Perl - setpwent函数

描述 此功能将枚举设置(或重置)到密码条目集的开头。应该在第一次调用getpwent之前调用此函数。 语法 以下是此函数的简单语法- setpwent返回值 此函数不返回任何值。 例 以下是显示其基本用法的示例代码- #!/usr/bin/perlwhile(($name, $passwd, $uid, $gid, $quota, …

3. 爬取自己CSDN博客列表(自动方式)(分页查询)(网站反爬虫策略,需要在代码中添加合适的请求头User-Agent,否则response返回空)

文章目录 步骤打开谷歌浏览器输入网址按F12进入调试界面点击网络&#xff0c;清除历史消息按F5刷新页面找到接口&#xff08;community/home-api/v1/get-business-list&#xff09;接口解读 撰写代码获取博客列表先明确返回信息格式json字段解读 Apipost测试接口编写python代码…

laravel框架中批量更新数据

在php框架中 tp中就有批量更新封装好的 SaveAll 在laravel中有批量插入没有批量更新操作;因此我们可以自己去封装一个 然后批量进行更新操作 封装参考代码: /*** 批量更新** param $tableName 表名称* param string $pk 更新的字段* param array $multipleData 要更新的数据*…

外企开展中国在线业务的三种网络加速方案:含免ICP备案CDN解决方案

中国作为全球除美国外最大的消费市场&#xff0c;是几乎每个国际化企业都想要深入挖掘的市场&#xff0c;但外国企业在中国开展在线业务需要面临一个比较特殊的挑战&#xff1a;互联网防火墙&#xff08;GFW&#xff09;。为此所有想要在中国市场有所作为的外企都需要首先解决这…

iptables之iptables表、链、规则 、匹配模式、扩展模块、连接追踪模块(一)

一、iptables的链 1.请求到达本机&#xff1a; PREROUTING --> INPUT --> Local Process &#xff08;本机&#xff09; 2.请求经过本机&#xff1a; PREROUTING --> FORWARD --> POSTROUTING 3.请求从本机发出&#xff1a;local Process&#xff08;本机&#xf…