美文网首页
微信小程序地图组件闪退问题解决

微信小程序地图组件闪退问题解决

作者: 誰在花里胡哨 | 来源:发表于2021-03-24 18:32 被阅读0次
    image.png

    问题:
    用户频繁切换头部tab,数据请求,地图更新
    ios正常
    !!android手机会出现闪退情况

    解决:
    经过各种排查,发现主要原因是因为标注文本总是呈显示状态,以至于过标注点时,绘制过多造成小程序闪退,此时只要注释掉display:'ALWAYS'即可

    // markers 储存点位属性
    ...
     callout: {
          content: null, //地址名称
          padding: 10, //气泡间距
          borderRadius: 4, //气泡圆角
          fontSize: 14, //气泡文字大小
          bgColor: '#fca93b', //气泡背景色
          color: '#ffffff', //气泡文字颜色
          // display: 'ALWAYS'
        }
    

    当然,注释掉之后气泡只有在点击标注点的时候才会显示,想要用户点击标记点或者点击气泡再进行操作的话,可以分别给<map>设置

    //点击标记点
    bindmarkertap="onTapMarker" 
    
    //点击气泡
    bindcallouttap="onTapMarker" 
    
    image.png

    其他未确定因素:
    也有可能tab切换过快,接口请求过于频繁造成的,此时你可以写一个计时器,避免这种问题

    const app = getApp()
    let timer = null
    Page({
    ...
    clickNav(e) {
        clearTimeout(timer)
    
        let { index } = e.currentTarget.dataset
        this.setData({activeIndex: index })
       //设置一个800ms的缓冲,避免用户的频繁点击
        timer = setTimeout(() => {
       //调用获取地图数据的接口
          app.$api.lifeServeList().then(res => {
          })
        }, 800)
      },
    })
    

    相关文章

      网友评论

          本文标题:微信小程序地图组件闪退问题解决

          本文链接:https://www.haomeiwen.com/subject/wqihhltx.html