vue中 路由传参query和params的区别

1.query传参，使用query传参，在定义路由的时候可以不配置参数名称，
路由跳转时既可以用path引入也可以用name引入。
query里的参数会和参数的值拼接在地址栏，跟ajax的get方法类似，传参可以在地址栏直接看到，安全性不高，
接收参数 this.$route.query.参数
定义路由

js路由跳转

地址栏

2.1params传参，在网上看了很多params传参的帖子，说的都不尽相同，最后自己测试了一下，发现得到的结果跟大多数人不同，如有错误望大家指出。

首先，**params传参，**只能用name引入路由。如果在定义路由的时候不配置路由参数。点击跳转到新页面也可以接收到参数（地址栏不会显示任何参数），但是一刷新页面就会失效，
接收参数用this.$route.params.参数

定义路由不配置参数

引入路由只能用name

地址栏（不会显示任何参数，但是参数传递确实成功了，但是刷新页面参数就会消失）

2.2 params传参时在定义路由时配置参数（正常情况）。路由跳转后地址栏仍然可以看见参数的值，但是不会将参数和参数的值以字符串的方式拼接在地址栏，仅仅是显示值并且刷新后参数不会消失。（这里我的测试结果与网上大多数的人说法不一致，如有错误，请大佬测试后指出。）

定义路由（需配置参数）。

路由跳转（只能用name）

地址栏（只能看到参数的值）