vue刷新子页面,跳到主页,params传参引起的血案!
今天,算是真正认识了params传参,为什么说params传参引起了血案?
起因是这样的,我正在做一个登陆的模块,公司想根据url不同的参数来区分是什么类型的会议,
于是后端推荐我用params传参的方式来实现这一设计,于是我毫不犹豫的在longin的路由上加上了params参数:
path: "/:order",
name: "index",
component: () =>
import(/* webpackChunkName: "about" */ "./pages/index.vue"),
注意,我在path上加上了params参数
http://localhost:8090/bb
我这样访问了页面,这个bb是我随便写的参数,对应的是order
然后我在这一页跳到了另一个页面
http://localhost:8090/com2
该页面路由配置如下:
{
path:'/com2',
name:'com2',
component:()=>
import('./components/com1.vue')
},
然后我在这页面上随意的刷新了一下!!!!
结果跳到了刚才那个页面,也许很多大佬已经发现了问题所在,但是我却蒙了。。。
我一直把params当成了一种路由传参的方式,其实就是传参,但是它还有一个作用就是动态路由。。
this.$router.push({name:"com2"})
上面的方式虽然可以跳到一个新的页面,但是在我刷新的时候,注意url路径是这样的
http://localhost:8090/com2
我却回到了和http://localhost:8090/bb一样的页面,
原因是router将com2当成了/路径的params参数,所以回到了和http://localhost:8090/bb一样的页面,
大佬们称这种为动态路由,我却一下子没转过弯,整了半天。
哪种不能其它页面都不能刷新了吧,
于是我在默认路径上加上了第二个params参数
path: "/:order/:lang",
这样,我在http://localhost:8090/com2页面刷新时就不会跳到跟页面了,原因是,我想跳到跟页面必须是/aa/bb这样的格式,路由匹配不上跟页面,所以就避免了上述问题。
vue刷新子页面,跳到主页,params传参引起的血案!的更多相关文章
- 利用PHP实现页面跳转同时POST传参,CURL不行
function payto(){ echo "<form style='display:none;' id='form1' name='form1' method='post' ac ...
- js中页面刷新和页面跳转的方法总结
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- AngularJS ui-router刷新子页面路由
网上有各种刷新子页面路由的方法,但是不知道为什么放到我的页面就不行了,尴尬! 网上的方法有: <a href="#" ui-sref="app.toMenu&quo ...
- mui---父页面跳子页面刷新子页面
最近在做项目,遇到一个问题,从父页面跳转到子页面,不会刷新子页面的问题. 解决方法:可以在跳转的时候,使用openWindow来进行跳转,接下来配置跳转打开页面的参数: 具体如下: mui.openW ...
- 利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据
利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据 实现描述:将数据存放在js对象中, 然后放在父页面的document对象中, 在页面刷新的时候将父页面的值取出来, ...
- Ionic01 简单介绍、环境搭建、创建项目、项目结构、创建组件、创建页面、子页面跳转
1 Ionic 基本介绍 Ionic 是一款基于 Angular.Cordova 的强大的 HTML5 移动应用开发框架 , 可以快速创建一个跨平台的移动应用.可以快速开发移动 App.移动端 WEB ...
- URL不变的情况下,最实用的vue刷新当前页面,provide / inject 组合 方式实现vue页面刷新
原文:https://blog.csdn.net/Dream_xun/article/details/83024487 其他参考:https://blog.csdn.net/liyunkun888/a ...
- vue常用操作及学习笔记(路由跳转及路由传参篇)
路由跳转 - 超链接方式跳转 html: <div id="app"> <h1>Hello App!</h1> <p> <!- ...
随机推荐
- 非常有用的pointer-events属性
介绍 pointer-events是css3的一个属性,指定在什么情况下元素可以成为鼠标事件的target(包括鼠标的样式) 属性值 pointer-events属性有很多值,但是对于浏览器来说,只有 ...
- JS基础_基本数据类型和引用数据类型
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- UVA571Jugs题解--简单数论(其实是瞎搞)
题目链接 https://cn.vjudge.net/problem/UVA-571 分析 刚做了道倒水问题的题想看看能不能水二倍经验,结果发现了这道题 题意翻译:https://www.cnblog ...
- 阿里巴巴开源框架java诊断工具--Arthas
下载:arthas wget https://alibaba.github.io/arthas/arthas-boot.jar java -jar arthas-boot.jar --target-i ...
- 去重复的sql(Oracle)
1.利用group by 去重复 2.可以利用下面的sql去重复,如下 1) select id,name,sex from (select a.*,row_number() over(partiti ...
- Go语言并发机制
Go语言中的并发 使用goroutine编程 使用 go 关键字用来创建 goroutine .将go声明放到一个需调用的函数之前,在相同地址空间调用运行这个函数,这样该函数执行时便会作为一个独立的并 ...
- hourglassnet网络解析
hourglassnet中文名称是沙漏网络,起初用于人体关键点检测,代码,https://github.com/bearpaw/pytorch-pose 后来被广泛的应用到其他领域,我知道的有双目深度 ...
- JVM学习笔记(一):Java虚拟机和虚拟机内存区域
为什么Java程序需要运行在虚拟机上 因为Java在设计之初的跨平台特性,我们知道Java程序是运行在Java虚拟机上的.如果你要问为什么Java程序要运行在虚拟机上,我可以反问你几个问题. 为什么买 ...
- 线程----code
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- 【异常】hue:unknown database hue
1 hue error日志报错,找不到hue数据库 2 解决办法 删除hue服务,重新添加,再次在添加database阶段验证密码,test通过,再继续. 还有造成这个事情的原因,是自己移动了mysq ...