路由跳转以及参数处理
项目中如果要使用一些参数，比如数据详情页面，YESWEB开发框架中不要使用带参数的路由，
因为框架中，显示tag是通过url去匹配的，
路由定义
包含参数的路由
JavaScript 全选
{
path: '/demosales/view/:id',
name: 'demosales_view',
title: '查看数据',
component: () => import( /* webpackChunkName: "demosales_dataview" */ './data-view.vue')
}包含参数的路由2 参数可选
参数后面带上问号?，代表该参数为可选参数
JavaScript 全选
{
path: '/demosales/data/:id?',
name: 'demosales_data',
title: '明细数据',
component: () => import( /* webpackChunkName: "demosales_dataview" */ './data-view.vue')
}路由跳转
路由参数
利用this.$router.push的方式进行路由跳转，params为路由参数
JavaScript 全选
this.$router.push({
name:'demosales_view',
params: {
id:id
}
})更多路由跳转细节，参考：https://www.yesdotnet.com/archive/post/260484735352837.html
URL参数
在URL中以?参数的形式
JavaScript 全选
this.$router.push({
name:'demosales-dataview',
query: {
id:id
}
})获得路由参数值
获得路由参数值
在路由中配置参数
JavaScript 全选
{ path: '/home/newsinfo/:id', component: yesdotnetTest.vue }VUE获取路由参数的方式
JavaScript 全选
let id = this.$route.params.id获得URL参数
在URL中配置的get参数 ?后面
Markup 全选
http://192.168.1.105:8080/#/idInput?username=yesdotnetvue获得url参数的方式
JavaScript 全选
let id = this.$route.query.username
版权声明：本文为YES开发框架网发布内容,转载请附上原文出处连接
YESWEB 张国生
