Vue 的路由实现 Hash模式 和 History模式


Hash 模式:

Hash 模式的工作原理是onhashchange事件,Window对象可以监听这个事件...

可以通过改变路径的哈希值,来实现历史记录的保存,发生变化的hash 都会被浏览器给保存下来,所以下次尽管浏览器没有请求服务器,但是还是将页面和url 给关联起来,这就是所谓的前端路由。

每次或者了哈希值,就知道路径,知道路径,就能获得路由组建,有了路由组建,就可以将页面显示出来。

 

History 模式:

通过浏览器保存历史路径,由于Hash模式,每次只能改变#后面的路径参数,history 则给予了前端路由完全的自由。

通过api 取访问历史路径,history,back(),forward(),go(),实现了页面的回退,前进,以及跳转,

在vue.js中也可以用$router.push(url), $router.replace(),$router.back(),

$router.push(url) 是一层一层退,(数据结构是栈)

$router.replace,是直接替换它不会向 history 添加新记录。

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM