重构生命周期

Friday, March 18, 2022

重构生命周期

  1. 为了统计用户在每个页面的停留时间,我们在小程序的生命周期方法 onShowonHide 中加入了统计时间的钩子函数。具体实现步骤如下:
  2. 首先,在 app.js 入口文件中,我们对 Page 方法进行了改写,因为小程序的页面是通过 Page 方法注册的,这些参数包括生命周期函数。我们调用 LovePageHook 方法,并将 Page 函数作为参数传入。接着,定义一个 originPage 变量来保存原始的 Page 函数,然后重新定义 Page 方法。
  3. 在新定义的 Page 方法中,我们首先对每个生命周期方法进行重写,保存原有的生命周期函数,并在其中加入 pageExposure 统计方法,确保在执行原有生命周期逻辑之前进行时间统计。最后,我们调用原始的 Page 函数,结合重写的生命周期方法参数对页面进行了初始化,从而实现了页面的统计功能。
  4. pageExposure 方法主要用于保存一个上报对象,该对象包括当前页面路径、上一个页面路径、进入和离开时间,以及停留时间。在 onShow 方法中,我们将对象中的 page 参数更新为当前路径,并记录 begin_time 为当前时间。当触发 onHide 时,我们判断对象中的 page 参数是否与当前路径相同。如果不同,则说明发生了页面跳转,此时将 end_time 设置为当前时间,并计算停留时间(end_time - begin_time)。最后,将上报对象作为日志进行上报,并更新 from_page 为上报对象中的 page
  5. 通过这种方式,我们实现了对用户在每个页面停留时间的精准统计。