单页应用的原理从早起的根据url的hash变化，到根据H5的history的变化，实现无刷新条件下的页面重新渲染。那么在单页应用中是如何监听url的变化呢，本文将总结一下，如何在单页页面中优雅的监听url的变化。 单页应用的原理，在我们的上一篇文章中React-Router源码…

window.history属性指向 History 对象,是浏览器的一个属性,表示当前窗口的浏览历史,History 对象保存了当前窗口访问过的所有页面地址。更多了解History对象,可参考阮一峰老师的介绍: History 对象

那时毕业后的大半年写前端就只用了 jquery ，没有现在这些前端框架提供的工程化，模块化，组件化（其实有，但我还没学没用，而且我进的第一个公司那时我是公司的第一个前端，没有前辈的教导，自己摸索）。写前端就用了js（jquery），css，html，来进行项目的工程文件目录结构…

前端三大框架 Angular、React、Vue ，它们的路由解决方案 angular/router、react-router、vue-router 都是基于前端路由原理进行封装实现的，因此将前端路由原理进行了解和掌握是很有必要的，因为我们再使用的过程中也难免会遇到一些坑，一旦…

1. 滑动效果： https://biaochenxuying.github.io/route/index.html 2. 淡入淡出效果： https://biaochenxuying.github.io/route/index2.html 1. 需求 因为我司的 H 5 的项…

1. 什么是路由 早期的路由都是后端直接根据 url 来 reload 页面实现的，即后端控制路由。 后来页面越来越复杂，服务器压力越来越大，随着 ajax（异步刷新技术） 的出现，页面实现非 reload 就能刷新数据，让前端也可以控制 url 自行管理，前端路由由此而生。 …

最新一直在看关于 Vue 和 React 路由这块的知识，最终发现这些路由框架的模块功能的实现都是基于浏览器原生路由 API 的。本着追根溯源的初心，于是就想着将浏览器原生的路由 API 整体梳理一遍，以便更加顺畅的理解 Vue-Router 和 React-Router 的相…

目前前端三杰 Angular、React、Vue 都推介单页面应用 SPA 开发模式，在路由切换时替换 DOM Tree 中最小修改的部分 DOM，来减少原先因为多页应用的页面跳转带来的巨量性能损耗。它们都有自己的典型路由解决方案，@angular/router、react-r…

1. 功能 介绍：通过hash模式下的改变url进行组件切换，因为是hash实现的所以url的改变不会真正的向服务器发送请求。 介绍：类似vue-router中router-view标签的功能，切换url后，"组件"会在这个标签中被渲染。当然，这里的组件也不是严格意义上的vue…