若依实现路由跳转功能 动态路由获取参数

若依实现路由跳转功能 动态路由

若依前端中的动态路由参考代码

动态路由设置：router文件
{path: '/system/dict-data',component: Layout,hidden: true,permissions: ['system:dict:list'],children: [{path: 'index/:dictId(\\d+)',component: () => import('@/views/system/dict/data'),name: 'Data',meta: { title: '字典数据', activeMenu: '/system/dict' }}]},路由跳转到新页面<el-table-column label="字典类型" align="center" :show-overflow-tooltip="true"><template #default="scope"><router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type"><span>{{ scope.row.dictType }}</span></router-link></template></el-table-column>

查看详情的动态路由写法（保证权限控制继续生效）

{path: '/hg/contract-detail',component: Layout,hidden: true,permissions: ['hg:contract:list'],children: [{path: 'index/:id(\\d+)',component: () => import('@/views/hg/contract/detail'),name: 'detail',meta: { title: '查看详情' ,activeMenu: '/hg/contract' }}]},

动态路由获取参数

//首先要导入route对象
const route = useRoute();
//通过route.params来获取请求中携带的id，然后再进行下一步操作
getDetail(route.params && route.params.id);