params 和 query 传参的区别
很多人都知道params 和 query 都可以在页面跳转的时候传递参数。
query更加类似于我们ajax中get传参,params则类似于post,说的再简单一点,前者在浏览器地址栏中显示参数,后者则不显示
最近有一个需求,比如详情页,要求按F5刷新完后数据还是能正常展示,详情页是在created后用ID请求。
如果是用query 传递过来的id,在this.$route,上会一直存在。
但是如果用params的时候,如果不做别的配置,直接在路由跳转的时间加params,F5刷新数据可能就不存在了。
如果一定要用params也可以,在router文件的 path 后面 + “/:id”,这样页面F5刷新后ID还是在router中。
如果是单独的详情页这样也是可以的,但是如果新增和编辑都是跳转同一个路由呢,这样就会报错了,因为编辑要请求详情,就需要ID,但是新增的时候是没有ID的
这时候就需要 path 后面 + “/:id?”,也就是id后面加一个“?”,和正则的意思一样,可有可无。这样就不会报错了。
个人还是建议用 query ,因为它不需要改变 path规则。
params 和 query 传参的区别的更多相关文章
- Vue Router的params和query传参的使用和区别
vue页面跳转有两种方式分别是:name和path this.$router.push({name: 'HelloWorld2}) this.$router.push({path: '/hello-w ...
- vue params和query传参区别
参考地址:https://blog.csdn.net/bluefish_flying/article/details/81011230 router.js中 路由设置这里, 当你使用params方法传 ...
- (转)vue router 如何使用params query传参,以及有什么区别
写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...
- vue router 如何使用params query传参,以及有什么区别
写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...
- 记录下mybatis中#{}和${}传参的区别
最近在用mybatis,之前用过ibatis,总体来说差不多,不过还是遇到了不少问题,再次记录下, 比如说用#{},和 ${}传参的区别, 使用#传入参数是,sql语句解析是会加上"&quo ...
- (后端)Mybatis中#{}和${}传参的区别及#和$的区别小结(转)
原文地址:https://www.cnblogs.com/zqr99/p/8094234.html 最近在用mybatis,之前用过ibatis,总体来说差不多,不过还是遇到了不少问题,再次记录下, ...
- Mybatis中#{}和${}传参的区别及#和$的区别小结
最近在用mybatis,之前用过ibatis,总体来说差不多,不过还是遇到了不少问题,再次记录下, 比如说用#{},和 ${}传参的区别, 使用#传入参数是,sql语句解析是会加上"&quo ...
- vue-router 使用query传参跳转了两次(首次带参数,跳转到了不带参数)
问题: 在做项目的过程中,使用query传参数,发现跳转过程中第一次有参数,但是路由马上又跳转了一次,然后 ?和它之后的参数都不见了 问题分析: 因为路由加载了两次 解决办法: ·1. 找到总的 la ...
- vue-router4 |name的作用|query传参|parmas传参|动态路由参数|命名视图|别名alias|前置路由守卫|路由过渡效果|滚动行为
vue-router4 出现 No match found for location with path "/" #### router/index.ts文件 import { c ...
随机推荐
- Obj-C数组以及字符串拼接与分割
本文转载至 http://mobile.51cto.com/iphone-392148.htm Obj-C只是增加了一点“特殊语料”的C语言,所以可以用printf()代替NSLog().但我们建议使 ...
- Redis主从、事务、哨兵、消息、代理分片
安装 wget http://download.redis.io/releases/redis-3.0.5.tar.gz tar -zxvf redis-3.0.5.tar.gz cd redis-3 ...
- sqlserver删除所有表
--/第1步**********删除所有表的外键约束*************************/ DECLARE c1 cursor for select 'alter table ['+ o ...
- Netty 100万级到亿级流量 高并发 仿微信 IM后台 开源项目实战
目录 写在前面 亿级流量IM的应用场景 十万级 单体IM 系统 高并发分布式IM系统架构 疯狂创客圈 Java 分布式聊天室[ 亿级流量]实战系列之 -10[ 博客园 总入口 ] 写在前面 大家好 ...
- 【python】-- 函数非固定参数,返回值(return)
函数非固定参数 1.默认参数: 代码如下: def information_register(name,age,country,sex): print("----注册信息------&quo ...
- Python菜鸟之路:Python基础-线程池注释
import sys import threading import Queue import traceback # 定义一些Exception,用于自定义异常处理 class NoResultsP ...
- ASP-AJAX-分页格式
HTML: <html> <head> <title>Mazey</title> <meta name="description&quo ...
- 我的Android进阶之旅------>Android颜色值(RGB)所支持的四种常见形式
Android中颜色值是通过红(Red).绿(Green).蓝(Blue)三原色,以及一个透明度(Alpha)值来表示的,颜色值总是以井号(#)开头,接下来就是Alpha-Red-Green-Blue ...
- 记一次bash脚本报错原因
准备部署上次写的 爬虫的定时任务,发现sh脚本 写为最简单的cd ,也报错 后来网上一波了解,原因竟是 : 额,格式问题,我为了图方便是在window里用notepad++写的,然后我再linux 系 ...
- [转载]设计模式的UML图
1.抽象工厂(Abstract Factory)模式 意图:为特定的客户(或情况)提供特定系列的对象. 2.类的适配器(Adapter)模式 意图:将一个类的接口转换成客户希望的另外一个接口. 3.对 ...