首页 > 其他 > 详细

【vue】--vueRouter

时间:2019-10-08 21:38:49      阅读:96      评论:0      收藏:0      [点我收藏+]

动态路由匹配

const router = new VueRouter({
  routes: [
    // 动态路径参数 以冒号开头
    { path: ‘/user/:id‘, component: User }
  ]
})
当匹配到一个路由时,参数值会被设置到 this.$route.params

响应路由参数的变化

watch: {
    ‘$route‘ (to, from) {
      // 对路由变化作出响应...
    }
  }
 beforeRouteUpdate (to, from, next) {
    // react to route changes...
    // don‘t forget to call next()
   // 在当前路由改变,但是该组件被复用时调用 (动态路由)
    // 举例来说,对于一个带有动态参数的路径 /foo/:id,在 /foo/1 和 /foo/2 之间跳转的时候,
    // 由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
    // 可以访问组件实例 `this`
  }

捕获所有路由或 404 Not found 路由

{
  // 会匹配所有路径
  path: ‘*‘
}
{
  // 会匹配以 `/user-` 开头的任意路径
  path: ‘/user-*‘
}

当使用一个通配符时,$route.params 内会自动添加一个名为 pathMatch 参数。它包含了 URL 通过通配符被匹配的部分

 

【vue】--vueRouter

原文:https://www.cnblogs.com/zjt-blogs/p/11637408.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!