目录
第一章:前端路由与后端路由的区别
推荐网址去更多了解:
1.1 如何使用
直接下载
模块化工程中使用:
第二章:路由的基本使用
2.1 路由vue-router的基本使用
组件模板:
书写路由匹配规则:
将匹配规则注入:
应用:
当点击链接时,url地址改变,当注册到Vue中的监听器监听到url改变时,便去routes中去找匹配的路径,当找到匹配的之后便会将其刷新到router-view框中去.
2.2 路由router-link的使用
在href中写#有点麻烦,所以可进行如下替代:如果用了tag属性就可以渲染成span标签,也可以进行使用.
2.3 路由重定向的使用
如果用两个不一样的path指定一个组件的话,就会引起迷惑,所以不推荐.如下图两个都指定login组件就是不推荐的.
所以可以用重定向进行优化:
2.4 实现路由的高亮
2.4.1 第一种
通过设置样式,这个是router默认提供的一个类名
2.4.2 第二种
通过在new router时传一个linkActiveClass的属性
第三章:路由传参
3.1 使用query方式传递参数
组件:
书写路由对象:
将路由对象挂载到Vue实例中,因为属性值与属性一样,所以可以简写成一个属性
应用:
效果:
3.2 使用params方式传递路由参数
将3.1的东西改一部分
更改路由规则:
更改模板:
更改应用:
第四章 使用children属性实现路由嵌套
不论是登陆还是注册它们都是平级的,现在我们要在组件里再增加新的路由,就必须要用children属性实现此功能.
组件:
路由:
应用:
第五章 使用命名视图实现经典布局
组件:
路由:
应用:
样式:
