vue 提取懒加载为组件

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
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。