Vue.JS快速上手（Vue-router 实现SPA 开发）
2024-10-19 17:47:23
一、什么是路由
URL -> 映射 -> 组件
Hash+onhashchange
History.pushstate+replaceState+onpopstate
二、准备工作
组件
router-link: 导航，最终默认情况生成a标签
router-view:组件容器，占位符(插座), 相当于之前.container的div
对象
routes: 路由表, 配置url与组件间的关系集合
router: 路由对象， 存储路由相关信息，并可以操作路由切换
三、使用vue-router 开发SPA 基本步骤
第1步：安装vue-router
第2步：导入路由模块
第3步：配置路由表
第4步：创建路由对象
第5步：注入路由对象
第6步：导航(静态与动态)
第7步：添加路由插座(router-view)
四、使用路由实现组件间数据传递
1.查询字符串
2.路由参数
五、路由嵌套
六、路由守卫
1 什么是守卫
路由切换时，控制组件加载前或离开后的行为, 如：组件访问前的权限，统计组件停留的时间(前、后),
2 守卫类型
触发时机：前守卫与后守卫
作用域：
全局守卫: 控制任何路由切换
独立守卫：控制针对特定路由切换
组件守卫：专门控制特定组件
七、路由懒加载
最新文章
- ajax-登陆+验证码
- android + red5 + rtmp
- Bootstrap页面布局18 - BS导航路径以及分页器
- _js day11
- HNU 12850 Garage
- hdu 3498 whosyourdaddy 重复覆盖
- T4模版
- Java中的clone()----深复制，浅复制
- 表迁移工具的选型-xtrabackup的使用
- [CF908D]New Year and Arbitrary Arrangement
- ●HDU 5608 function
- 注解@Resource和@Autowired区别对比
- centos设置路由route
- 根据设备width(375)动态设置font-size
- [原创]Modbus协议学习笔记
- spring引入HikariCP连接池
- 各平台免费翻译API
- jsp取addFlashAttribute值深入理解即springMVC发redirect传隐藏参数
- Windows NTLM Hash和Hash传递、Key传递攻击
- 【转】“菜”鸟理解.NET Framework(CLI,CLS,CTS,CLR,FCL,BCL)