博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue 的路由实现 Hash模式 和 History模式
阅读量:5318 次
发布时间:2019-06-14

本文共 523 字,大约阅读时间需要 1 分钟。

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 添加新记录。

 

转载于:https://www.cnblogs.com/pickKnow/p/10477180.html

你可能感兴趣的文章
面向对象(多异常的声明与处理)
查看>>
MTK笔记
查看>>
ERROR: duplicate key value violates unique constraint "xxx"
查看>>
激活office 365 的启动文件
查看>>
无法根据中文查找
查看>>
[简讯]phpMyAdmin项目已迁移至GitHub
查看>>
转载 python多重继承C3算法
查看>>
【题解】 bzoj1597: [Usaco2008 Mar]土地购买 (动态规划+斜率优化)
查看>>
css文本溢出显示省略号
查看>>
git安装和简单配置
查看>>
面向对象:反射,双下方法
查看>>
鼠标悬停提示文本消息最简单的做法
查看>>
课后作业-阅读任务-阅读提问-2
查看>>
面向对象设计中private,public,protected的访问控制原则及静态代码块的初始化顺序...
查看>>
fat32转ntfs ,Win7系统提示对于目标文件系统文件过大解决教程
查看>>
Awesome Adb——一份超全超详细的 ADB 用法大全
查看>>
shell cat 合并文件,合并数据库sql文件
查看>>
Android 将drawable下的图片转换成bitmap、Drawable
查看>>
介绍Win7 win8 上Java环境的配置
查看>>
移动、联通和电信,哪家的宽带好,看完你就知道该怎么选了!
查看>>