vue-router前端路由

纵然是瞬间 提交于 2020-02-02 20:43:16

路由分为前端路由和后端路由,后端主要是通过识别请求路径,分发对应的资源,
而前端路由主要是针对SPA单页面应用的局部刷新。识别触发的事件,分发对应的渲染内容。
vue-router中的router-link就会默认被渲染为a标签,在其path中的路径上加上#采用hash链接的方式进行导航,从而渲染对应的组件。

下面是使用vue-router的基本步骤:

1.引入库文件
2.添加路由链接
3.添加路由占位
4.定义路由组件
5.创建路由实例对象并配置规则
6.将路由挂载到vue根实例中

关于动态路由匹配:

(1)使用$route.params.参数,不够灵活
3.png
(2)使用Prop传参,boolean类型这一种最简单常用
5.png
(3)使用prop传递静态参数
4.png
(5)动静参数结合
6.png

命名路由的导航

7.png

编程式导航

this.$router.push('')  
this.$router.go(-1)
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!