微信小程序图片加载太慢；uni-app微信小程序加载图片优化；微信小程序图片image加载成功事件@load；图片加载成功触发@load事件

场景： 微信小程序，对于以下较大的图片（例如几M），在真机运行时候加载比较慢，此时会有一个比较长时间的白屏，体验很差。

解决方案：图片未加载成功前，进行loading…;图片加载完成后会触发@load事件；

<template>
  <view class="big_box">
    <image @load="loadImg($event)" @error="errImg" src="../pagesC/static/sun.jpg" mode="scaleToFill" />
  </view>
</template>

<script>
export default {
  data () {
    return {
      imgurl: '../pagesC/static/sun.jpg'
    }
  },
  onShow () {
    //开启加载
    uni.showLoading({
      title: '加载中...',
      mask: true
    })
  },
  methods: {
    // 此方法会在图片加载完成后触发
    loadImg (e) {
      uni.hideLoading()
      console.log('图片信息', e)
    },
    errImg () {
      uni.hideLoading()
    }
  },
}
</script>

<style lang="less" scoped>
.big_box {
  height: 100vh;
  image {
    width: 100%;
    height: 100%;
  }
}
</style>