图片懒加载

视图层

main.js

app.directive('lazyload',{
  mounted(el, binding, vnode, prevVnode) {
    const intersectionObserver = new IntersectionObserver((entries) => {
      entries.forEach(dom => {
        dom.isIntersecting && (el.src = el.getAttribute('data-src'))
      })
    });
    // 开始监听
    setTimeout(()=>{
      intersectionObserver.observe(el);
    },1000)
  },
})
app.mount('#app');

你可能感兴趣的:(前端,vue.js,javascript)