需求：多个模块在一个页面的数据看板，一次性请求多个接口，会造成页面卡断，有的接口运行缓慢，甚至出现canceled的情况
解决思路：前端进行接口滚动，自定义指令进行接口懒加载（模仿懒加载图片），滚动页面，当需要展示的页面出现在可见视图中，才进行接口加载
<div ref="businessTab" id="模块id1" v-lazy-load="lazyMethod"></div><div ref="businessTab" id="模块id2" v-lazy-load="lazyMethod"></div><div ref="businessTab" id="模块id3" v-lazy-load="lazyMethod"></div>.....import Vue from 'vue'Vue.directive("lazyLoad", {bind: function(el, binding,vnode) {let lazyImageObserver = new IntersectionObserver((entries, observer) => {entries.forEach((entry, index) => {let lazyImage = entry.target;// 相交率，默认是相对于浏览器视窗if (entry.isIntersecting){if (lazyImage.id==="模块id1") {// 在自定义指令中 用 vnode.context.方法名（） 来 访问methods中的方法vnode.context.方法名字1()vnode.context.方法名字2()}else if (lazyImage.id==="模块id2") {vnode.context.方法名字1()vnode.context.方法名字2()} else if (lazyImage.id==="模块id3"){vnode.context.方法名字1()vnode.context.方法名字2()}}})})lazyImageObserver.observe(el);},});
lazyMethod() {},
