本章开始学习vue-router这个库,来认识单页应用的路由模块,使作为开发者的我对路由这个模块有个深刻认识。
学习顺序
说实话,怎么写好这篇解析对我十分困扰,主要是因为以下几点
- 没有程序运行的流程图
- 源码包含了太多的钩子函数,包括过度、滚动等钩子
- 源码使用了面向对象编程,各种引用、闭包间联系很难搞清楚
- 源码提供了一部分对错误的处理方法,这种代码就很难说明是干什么的
- 对window的history等api以及url变更过程不熟悉
对策
所以我打算先从基础的开始,对浏览器地址栏相关api有一个了解
从这个基础上,再阐述单页应用的路由实现方案。(哈希模式、history模式)比较
再谈谈具体Vue是如何实现路由
简单的vue-router使用方法
import Router from "vue-router";
Vue.use(Router);
const router = new Router({
routes
});
new Vue({
....,
router
},document.getElementById('app'))
网友评论