亲宝软件园·资讯

展开

不重新加载的情况下改变浏览器地址

xiebenyin 人气:0

我以前在学习/使用 vue-router 的时候不理解为什么浏览器地址发生了改变,浏览器却不用重新加载。

现在我可以把这个东西讲明白了,有两种方案可以实现改变 URL 但页面不进行整体的刷新。

hash 模式

location.hash = "foo"

可以通过直接赋值 location.hash 来改变 URL但页面不刷新

浏览器不会发送请求,使用 hash 改变 URL 后页面刷新会正常显示

history 模式

history.pushState({name: "Nicholas"},  "Nicholas' page",  "nicholas.html")

history.pushState()方法接收三个参数:状态对象(可以传一个空对象), 新状态的标题(可以传一个空字符串),相对URL

浏览器不会发送请求,使用 history.pushState() 改变 URL 后页面刷新不会正常显示

history.replaceState({}, '', 'demo')

接收的参数与 history.pushState() 方法一致

与 history.pushState 区别是 不会在历史状态栈中创建新状态,只会重写当前状态 (没有历史记录)。

 

加载全部内容

相关教程
猜你喜欢
用户评论