欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

uni-app的h5頁面中onHide/onUnload方法不觸發(fā)的問題解決方法

 更新時間：2023年12月27日 08:23:35   作者：洛千隕  
uni-app的頁面的生命周期包括onInit、onLoad、onShow、onReady、onHide和onUnload等幾個階段,這篇文章主要給大家介紹了關(guān)于uni-app的h5頁面中onHide/onUnload方法不觸發(fā)的問題解決方法,需要的朋友可以參考下

背景

  • 目的：對h5頁面進行埋點過程中，需要對頁面瀏覽時長進行統(tǒng)計，通過生命周期的監(jiān)聽上傳埋點日志
  • 預(yù)設(shè)方案：通過個頁面的onShow/onHide/onUnload生命周期對頁面的展示/隱藏/銷毀進行監(jiān)聽
  • 問題：僅在首頁正常觸發(fā)生命周期，通過跳轉(zhuǎn)進入的其他頁面的onShow正常觸發(fā)，onHide與onUnload不觸發(fā)

解決過程

  • 推測原因：通過路由跳轉(zhuǎn)的頁面屬于二級頁面，而onHide與onUnload生命周期僅在一級頁面中存在

解決方法

  • 二級頁面：
    • onShow：正常使用該生命周期監(jiān)聽頁面顯示，包括后臺進前臺與路由跳轉(zhuǎn)進入
    • destroyed：用組件生命周期代替onHide與onUnload，監(jiān)聽路由跳轉(zhuǎn)離開
  • app.vue：
    • onHide：應(yīng)用生命周期對整個應(yīng)用的前臺進入后臺進行監(jiān)聽，通過url區(qū)分不同頁面的埋點日志上傳

示例代碼

// 一級頁面-首頁
onShow() {
    this.$$DI.track('enter_page', {
        page_name: '首頁'
    })
},
onHide() {
    this.$$DI.track('leave_page', {
        page_name: '首頁'
    })
},
onUnLoad() {
    this.$$DI.track('leave_page', {
        page_name: '首頁'
    })
},

// 二級頁面
onShow() {
    this.$$DI.track('enter_page', {
        page_name: 'a頁面'
    })
},
destroyed() {
    this.$$DI.track('leave_page', {
        page_name: 'a頁面'
    })
}

// app.vue
onHide() {
    let page_name
    // 根據(jù)需要監(jiān)聽的頁面路由進行判斷添加
    if(window.location.href.includes('basic')) page_name = 'a頁面'
    if(page_name) {
        this.$$DI.track('leave_page', {
            page_name
        })
    }
},

總結(jié) 

到此這篇關(guān)于uni-app的h5頁面中onHide/onUnload方法不觸發(fā)的問題解決方法的文章就介紹到這了,更多相關(guān)uni-app onHide/onUnload方法不觸發(fā)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論