发布时间:2023-11-15 16:00
vue3项目埋点需求,需记录页面浏览时长,入口在第三方页面,从vue3页面返回到第三方页面时,onBeforeUnmount、onBeforeRouteLeave全部失效不执行,在vue3项目里组件之间跳转没问题。经测试,popstate事件监听pc端及移动端都失效;js的beforeUnload事件在pc端谷歌浏览器上返回第三方页面有效,vue项目内组件跳转无效,ios手机上这些事件监听及钩子函数全部无效。
解决方法:
监听js的pagehide事件,在pc端及移动端都有效,返回第三方页面和vue项目里点击按钮跳转第三方也都有效,(但是通过window.location.href跳转小程序时无效,浏览小程序的时间会计入到浏览页面时长里。可在点击跳转按钮时重新埋点)
pagehide和pageshow适合不同项目页面之间跳转监听;
onBeforeRouteLeave适合vue项目内组件之间跳转
代码:
//pagehide跳转第三方时执行
window.addEventListener(“pagehide”,pagehideFun)
const pagehideFun=()=>{
console.log(“监听pagehide事件”)
}
//pageshow从第三方跳转回来时执行
window.addEventListener(“pageshow”,pageshowFun)
const pageshowFun=()=>{
console.log(“监听pageshow事件”)
}
//在vue内组件之间跳转时需移除事件监听
beforeRouteLeave(){
window.removeEventListener(“pagehide”,pagehideFun)
window.removEventListener(“pageshow”,pageshowFun)
}
php 涂鸦,微信小程序demo推荐:微信涂鸦、canvas学习实例
用js将平数组转成key/value值,再转成有上下级的结构数据
110.网络安全渗透测试—[权限提升篇8]—[Windows SqlServer xp_cmdshell存储过程提权]
Intel RealSense Depth Camera D435i 跑通 RTAB-Map
【Abp VNext】实战入门(五):【3】前端管理界面 vue-element-admin —— Vuex状态缓存 自动持久化本地存储
到底什么是数据湖?全面解读数据湖的缘起、特征、技术、案例和趋势
Unity3d 2020.3.10总是出现Hold on...(busy for xxx)... Importing assets进度条问题