onPageStateChange在iphone上的2大坑点

用法:

坑点：

1、在安卓和iphone下返回的值不一样。

2、在部分iphone机型下，只有点击小程序右上角的圆点返回才能触发！！！

---

用法:

onPageStateChange这个api，从微信7.0.3开始，webview内可以通过判断下面的方式判断小程序是否在前台：

WeixinJSBridge.on('onPageStateChange', function(res) {
  console.log('res is active', res.active)
})

有了这个api，我们可以解决很多问题，例如：

1、iphone手机上，小程序内嵌套的h5视频，切换到后台时，会自动暂停视频，切回前台依然是暂停状态，可以通过该api自动恢复播放。

2、监听切换到前台事件，做刷新数据等操作。

坑点：

坑爹的东西来了。

1、在安卓和iphone下返回的值不一样。

在安卓上这个res.active返回的是string类型的值，

在iphone上，这个res.active返回的是boolean类型的值。

2、在部分iphone机型下，只有点击小程序右上角的圆点返回才能触发！！！

 这就是更恶心的bug了，目前我测试了iphonex下，手机home键可以触发，但是iphone11却只有点击右上角的圆点返回才能触发。

查阅资料后，果然有人发现同样问题。

 无奈，新api总会有缺陷，用就得有小白鼠的觉悟吧。

临时解决办法：

话是这么说，可是需求你还是得做吧，总不能两手一摊，说产品我实现不了这个功能。

于是，查了一下资料，原生js里有一个visibilitychange事件，可以监听当前页面窗口可见性是否发生了变化、

    addHtmlListener () {
      document.addEventListener('visibilitychange', _ => {
        console.log('visibilitychange', document.hidden)
        if (document.hidden) {
          // 网页被挂起 ---- 暂停音乐
        } else {
          // 网页被呼起 ---- 播放音乐
        }
      })
    },

经测试，对于上述问题2导致无法监听的场景，按home键，该api依然能够监听成功。

那么聪明的小伙伴可能会问了，那为什么不直接用这个api替换掉小程序的api呢？

那当然是这个api也有自身的局限性啊，例如我在1秒内按home切换，再快速返回，此时该api是无法监听到的！！

无奈......