监听图片加载完成刷新两个方法

方法一 用watch得到所有图片个数,@load监听每一张图片加载完counter+1,直到等于个数,再$emit

 methods: {
	    imgLoad() {
        if (++this.counter === this.imagesLength) {
	        this.$emit('imageLoad')
        }
	    }
    },
  watch: {
	    detailInfo() {
	    	this.imagesLength = this.detailInfo.detailImage[0].list.length
	    }
    } 

方法二 用封装好的防抖

//封装 防抖函数
export function debounce(func, delay) {
  let timer = null
  return function(...args) {
    if(timer)clearTimeout(timer)
    timer = setTimeout(() => {
        func.apply(this, args)
    }, delay);
  }
} 

 下面mixin里的

import {debounce} from './utils'

export const itemListenerMixin = {
  data() {
    return{
      itemImgListener: null,
      newRefresh: null
    }
  },
  mounted() {
    this.newRefresh = debounce(this.$refs.scroll.refresh, 100 )
    this.itemImgListener = () => {
      this.newRefresh()
    }
    this.$bus.$on('itemImageLoad', this.itemImgListener)
    console.log('nihao ')
  }
}

再  detail.vue里,@imageLoad="imageLoad" 接收,method方法里 this.refresh()


版权声明:本文为qd_xiaobai原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。