动态路由匹配和导航

逸男2022年12月12日
  • Vue
  • Vue2
小于 1 分钟

动态路由匹配和导航

1.实例获取参数

路由导航

<-- 路由导航传递参数 最后一位--> <router-link to="/index/1"></router-link>

路由配置

// :id 为接受的动态路由参数
routers: [{ path: '/index/:id', component: index }]

参数获取

// 在路由组件中获取路由参数
this.$route.params.id

2.props 接收参数

路由导航

<-- 路由导航传递参数 最后一位-->
<router-link to="/index/1"></router-link>

路由配置

// :id 为接受的动态路由参数
routers: [{ path: '/index/:id', component: index, props: true }]

参数获取

// 在路由组件中获取路由参数
prors: ['id']

3.编程式导航

this.$router.push("hash 地址")

this.$router.go(n) -1 表示后退 1 1 前进一位

this.$router.back() 后退 1
上次编辑于:
贡献者: yinan