问题描述
直接通过url地址进入的页面需要取消返回按钮,如何判断当前页面是否为进入时的第一页??
尝试过的方法
一、window.history
使用window.history.length来判断是否有上一级页面,在刚进入这个页面时是有效的,但是从下级页面返回时还是同样的出现,虽然返回当前页面但是window.history.length已经是2了。
第一次进入该页面没有出现返回按钮:
从下级页面返回之后还是会有返回:
二、document.referrer
我的项目是vue项目,所以document.referrer一直是空的,导致下级页面页没有返回按钮。
相关代码
if (window.history.length <= 1) {
this.hasReturn = false;
}
前言
使用单页面的话 document.referrer 会一直为空(.html或者ssr网页则存在值)
History.length 表示用户历史会话页面的数量。当用户从新的标签页或框架载入页面其值为“1”,每访问一个页面该值增加“1”。
因为history.length 的数量只增不减,根本不能拿来做判断。
场景
需要判断用户从微信浏览器通过浏览器打开当前网页,如果是则当用户点击返回按钮时返回到web应用(站点)首页
或:判断是否有前一页
通过history.length
history.length === 1
(其中手机浏览器中为1,chrome控制台为2)或:判断用户是否访问过
或:判断 history 中是否存在指定url
或:判断是否是通过微信浏览器唤醒设备浏览器再打开到当前网页的
肯定还有其他方法实现
当用户点击返回按钮时返回到web应用(站点)首页
这个功能的,现在脑袋有点晕,如果有的话,也希望能得到分享,非常感谢。对了,Vuex能否判断呢?实在是没有找到相关(内置)方法,或许有。不过即便没有的话也没关系,自己扩展一个就行。
Vue玩家还可参考:https://segmentfault.com/q/10...
还有
别忘记监听浏览器的返回事件啦 :
我是如何解决的
[狗头]
当用户在微信中打开web应用(站点)时,则提示用户使用浏览器打开;
再配合 Cookie和sessionStorage 缓存了router记录来判断用户点击返回按钮时是否需要直接回到home页;