当前位置: 代码迷 >> 综合 >> Vue Router 总结
  详细解决方案

Vue Router 总结

热度:8   发布时间:2023-12-13 21:07:44.0

一.route 对象

1).$route.path   //当前网页的路由地址   index/test

2).$route.params  //一个 key/value 对象,包含了动态片段和全匹配片段,如果没有路由参数,就是一个空对象。

   /index/bar:1   打印参数 { "id": ":1" }

3).$route.query  // index?user=3   打印参数 { "user": "3" }

4).$route.fullpath // 完成解析后的 URL,包含查询参数和 hash 的完整路径。

5).$route.matched

  • 类型: Array<RouteRecord>

一个数组,包含当前路由的所有嵌套路径片段的路由记录 。路由记录就是 routes 配置数组中的对象副本 (还有在 children 数组)。

遍历如下:

let matched = this.$route.matched.filter(item => item.name)
this.listLeve = matched
this.listLeve.forEach(i => alert(i.name)
)

6).$route.hash //当前路由的 hash 值 (带 #) ,如果没有 hash 值,则为空字符串。

//路由表
export default new Router({routes: [{path: '/index',name: '主页',component: HelloWorld,children: [{path: 'test',name: '测试页面',component: Test}]}]
})

 

  相关解决方案