详解Vue router路由

1.基本使用

详解Vue router路由_第1张图片

 详解Vue router路由_第2张图片

2.几个注意点

 详解Vue router路由_第3张图片

3.多级路由(多级路由)

详解Vue router路由_第4张图片

4.路由的query参数

详解Vue router路由_第5张图片

5.命名路由

例如像三级目录 ,每次写都需要带上一二级目录,比较麻烦,采用命名路由可以用name直接找到

详解Vue router路由_第6张图片

详解Vue router路由_第7张图片 

6.路由的params参数

1)在配置路由的时候需要先声明接收params参数,即先占位

 详解Vue router路由_第8张图片

2)

详解Vue router路由_第9张图片

 详解Vue router路由_第10张图片

 7.路由的props配置

详解Vue router路由_第11张图片

 router-linkreplace属性,在开启的时候,此次路由跳转会覆盖上次的路由历史记录。

8.编程式路由导航

 详解Vue router路由_第12张图片

缓存路由组件,写在include 中的组件才不会在切换的时候被销毁 。不写include就都缓存

9.缓存路由组件

详解Vue router路由_第13张图片

缓存多个的写法:

详解Vue router路由_第14张图片

路由组件相关的两个生命周期钩子:

1.作用:路由组件所独有的两个钩子,用于捕获路由组件的激活状态。

详解Vue router路由_第15张图片

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注脚本之家的更多内容!

你可能感兴趣的