File tree Expand file tree Collapse file tree 2 files changed +19
-7
lines changed Expand file tree Collapse file tree 2 files changed +19
-7
lines changed Original file line number Diff line number Diff line change @@ -18,9 +18,18 @@ yarn add vue-lazy-container
1818
1919## Usage
2020
21+ Write the following in your mian.js:
22+
23+ ``` javascript
24+ import VueLazyContainer from " vue-lazy-container" ;
25+ Vue .use (VueLazyContainer);
26+ ```
27+
28+ Example:
29+
2130``` javascript
2231< template>
23- < vue- lazy- container tag- name= " div" @change= " intersectingChange " >
32+ < vue- lazy- container tag- name= " div" @change= " visibilityChange " >
2433 < template v- if = " isLoaded" >
2534 <!-- your content -->
2635 < / template>
@@ -35,8 +44,11 @@ export default {
3544 };
3645 },
3746 methods: {
38- intersectingChange (args ) {
39- const { isIntersecting } = args;
47+ // visibility change
48+ visibilityChange (entry , observer ) {
49+ const { isIntersecting } = entry;
50+
51+ // visibility
4052 if (isIntersecting) {
4153 this .isLoaded = true ;
4254 // you can ajax request or other logic
@@ -58,6 +70,6 @@ export default {
5870
5971** Event**
6072
61- | 事件名称 | 说明 | 回调参数 |
62- | -------- | ------------ | ----------------- |
63- | change | 容器节点类型 | 观察者列表 |
73+ | 事件名称 | 说明 | 回调参数 |
74+ | -------- | ------------ | ---------- |
75+ | change | 容器节点类型 | 观察者列表 |
Original file line number Diff line number Diff line change 11{
22 "name" : " vue-lazy-container" ,
3- "version" : " 1.0.0-beta.1 " ,
3+ "version" : " 1.0.0-beta.2 " ,
44 "description" : " " ,
55 "files" : [
66 " dist" ,
You can’t perform that action at this time.
0 commit comments