vue-router小记几点

原创 缪缪 随笔 JS笔记 135阅读 2018-12-24 21:20:22 举报
  1. <router-link> 是路由导航标签, <router-view>是路由输出区域。
  2. <router-link>的to属性标记着 路由指向,属性值和routes配置中path进行匹配,找到对应的组件,并将组件渲染在<router-view>中。
  3. <router-link :to="字符串/对象"> === router.push("字符串/对象"),其中作为对象时,如果有Path参数,则params参数不生效。
  4. 动态路由如 path: '/user/:id', 可以通过$route.params.id获取值。
  5. 前端路由有两种模式: hash模式 和 history模式,hash模式是指在url后面增加#...做页面定位,hash改变会触发window上的onhashchange事件,而history模式是指 使用pushState将页面的状态进行保存,然后可以在window上监听onpopstate事件,获取保存的状态,需要注意的是,后台需要对不存在的链接进行处理,否则刷新可能会蹦出404。
  6. 复用的组件实例不会触发钩子事件,需要在watch上监听$route或者使用导航守卫。
  7. 导航守卫就是 在路由正在发生改变时,可以采取跳转或取消的方式。
  8. 使用路由时两种获取数据的方式: 在组件中的钩子中获取,相当于在新页面获取,或者 在beforeRouteEnter中获取,此时依然停留在旧页面。
评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复