正常来说不刷新页面,也能更改浏览器url地址的方法有很多,我们在网上搜的话可以看到有pushState、replaceState、popstate等方法,那还有没有其他方法呢?
答案是有的!
最近做一个vue商城项目的时候,用户点击支付时,用户可复制当前链接(加上登录态),粘贴到第三方浏览器之后,完成整个支付闭环。话不多说,直接贴代码:
let url = window.location.href;
let index = url.indexOf("?");
if (index != -1) {
window.location.href = url.substring(0, index);
}
window.location.href += `?_t=${_state.user.token}`;
有些人看到上面的代码,会有些疑问, window.location.href不是会使页面跳转了吗?当初我也是这么认为,后面我在网上搜了,才知道这个原因:
以上意思是,总体的意思就是假如浏览器url后面带有#, 使用window.location.href, 是无法跳转的,这个刚好是vue的单页面应用的一个特性!,所以利用这个特性,就可以实现不刷新页面,也能更改浏览器url地址