src/router/index.js：路由配置 配置name
export default new Router({ routes: [ //发送的页面 { path:'/chat', name:'chat', component: chat }, //接收参数的页面 注意这个name { path:'/taskCenter', name:'taskCenter', component: TaskCenter } ] })- 跳转路由参数在地址栏显示 （path;query）
path方式跳转
//简写不传参 this.$router.push('/taskCenter') //全写传参 this.$router.push({path:'/taskCenter',query:{name1:'1',name2:'2'}})query获取传参
this.$route.query.name; this.$route.query.name2;- vue让跳转路由参数不在地址栏显示(name;param)
name方式跳转：push绑定的不再是path而是使用了你要发送的页面的name值
this.$router.push({name:'taskCenter', params:{id: ids, savePath: savePath}})param获取传参：
mounted() { this.requestIds=this.$route.params.id; this.requestXmlPath=this.$route.params.savePath; }- 未搭配动态路由时导航栏时：不会在导航栏中显示传递的数据，也可以正常获得params中的数据，但是刷新页面 后会丢失params中传递的数据
- 设置动态路由后导航栏显示效果，就算刷新页面也不会丢失params中的数据，但同时也暴漏的传递的数据
//router配置 const routes = [{ path: '/chat/:id/:name', name: 'Chat', component: Chat }]
- query传参相当于get方式，会把要传递的参数显示在导航栏中。
- params传参相当于post方式。默认不会把传递的参数显示在导航栏中。
- query跳转路由传参显示参数这对于普通数据没什么,但是对于敏感数据，比如 涉及到用户敏感信息 ，避免使用query。
- 我们可以用params方式传递参数，它不会把传递的参数显示到导航栏中。
版权声明：
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符，请将相关资料发送至xkadmin@xkablog.com进行投诉反馈，一经查实，立即处理！
转载请注明出处，原文链接：https://www.xkablog.com/qdvuejs/11143.html