继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

vue 子组件懒加载功能

关注TA
已关注
手记 67
粉丝
获赞

懒加载功能

子组件扩展参数

参数功能
备注

WatchScroll

是否需要懒加载true必需

winHeight

父元素高度

window.screen.availHeight

必需

ScrollState

滚动监听+new Date()必需


需要父组件做处理

操作代码样例
引入子组件

<hfq-img
                :imgs="scope.row.thumb_img"
                :resourceUrl="resourceUrl"
                :WatchScroll="true"
                :winHeight="winHeight"
                :ScrollState="ScrollState"
              ></hfq-img>

注册子组件需要参数

ScrollState: 0,
      winHeight: 0,

引入事件监听

    window.addEventListener("scroll", this.handleScroll, true);

加入监控函数

   //滚动事件抓取
    handleScroll() {
      this.winHeight = window.screen.availHeight;
      this.ScrollState = +new Date();
    },



打开App,阅读手记
1人推荐
发表评论
随时随地看视频慕课网APP