Vue 기반 지연 로딩 플러그인 vue-view-lazy 소개

이 글에서는 가시 영역에 진입한 후 사진이나 기타 리소스를 로드할 수 있는 Vue 기반 지연 로딩 플러그인 vue-view-lazy를 주로 소개합니다. 내용이 꽤 좋아서 지금 공유해 보겠습니다. 참조.

vue 기반 지연 로딩 플러그인

목적: 가시 영역에 진입한 후 사진 또는 기타 리소스 로드

설치 및 사용

1. 에서 vue-view-lazy.min을 직접 다운로드 dist 디렉토리를 사용하세요.

vue-view-lazy

2. 
   소개

   .main 파일

<p id="app">
  <span v-view-lazy @model="handleModel"></span>
</p>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script src="./dist/vue-view-lazy.min.js"></script>
<script>
  Vue.use(vViewLazy.default,{});
  new Vue({
    el:&#39;#app&#39;,
    data:{
      msg:&#39;数据&#39;
    },
    methods:{
      handleModel(){
        console.log(&#39;出现了&#39;);
      },
    },
  })
</script>

사진 지연 로딩

.vue 파일

$ npm install --save-dev vue-view-lazy

데이터 지연 로딩

.vue 파일

rr 리

이상이 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용을 보시려면 PHP 중국어 홈페이지를 주목해주세요!

관련 권장 사항:
Vue 사용자 정의 지침을 기반으로 버튼 수준 권한 제어를 구현하는 방법

vue 구성 요소 이름 소개

위 내용은 Vue 기반 지연 로딩 플러그인 vue-view-lazy 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!