美文网首页
vue 提取懒加载为组件

vue 提取懒加载为组件

作者: 从前慢pearl | 来源:发表于2020-10-21 15:09 被阅读0次

    1,需求

    多个页面用到列表懒加载

    2,

    提取出组件

    3,页面A(父文件)

    image.png
    image.png

    4,页面B(父文件)

    同页面A的方式引入 lodeMore 组件

    5, lodeMore 组件(懒加载为组件)

    image.png
    image.png
    image.png

    6,注意

    在这里子组件通过滚动事件 调用多个父组件的方法
    我这边一开始
    子组件调用父组价 使用的是下面这种方法:


    image.png

    出现了一个bug:
    在页面B 滚动 数据加载的时候,同时调用了页面A的方法

    经测试,如果子组件只是点击事件触发父组件的方法,不会出现上面的bug

    测试列子:

    1,滚动事件

    测试: this.$parent.fafun();

    页面A:


    image.png

    页面B


    image.png

    相关文章

      网友评论

          本文标题:vue 提取懒加载为组件

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