Browse Source

Merge branch 'v2-dev' of https://github.com/jdf2e/nutui into v2-dev

Ymm0008 5 years ago
parent
commit
85a6e1cbca
2 changed files with 23 additions and 15 deletions
  1. 2 1
      src/packages/infiniteloading/doc.md
  2. 21 14
      src/packages/infiniteloading/infiniteloading.vue

+ 2 - 1
src/packages/infiniteloading/doc.md

@@ -63,7 +63,8 @@ export default {
 | is-showMod | 是否展示懒加载模块内容,一般适用于选项卡切换 | Boolean | false
 | use-window | 将滚动侦听器添加到 window 否则侦听组件的父节点 | Boolean | true
 | use-capture | 是否使用捕获模式 true捕获 false冒泡 | Boolean | false
-| unload-more-txt | 没有更多数据展示文案 | String | 哎呀,这里是底部了啦
+| unload-more-txt | 没有更多数据展示文案 | String | 哎呀,这里是底部了啦' 
+| container-id | 在use-window属性为false的时候,自定义设置节点ID | String | ''
 
 ## Event
 

+ 21 - 14
src/packages/infiniteloading/infiniteloading.vue

@@ -15,35 +15,39 @@ export default {
   props: {
     hasMore: {
       type: Boolean,
-      default: true
+      default: true,
     },
     isLoading: {
       type: Boolean,
-      default: false
+      default: false,
     },
     threshold: {
       type: Number,
-      default: 200
+      default: 200,
     },
     useWindow: {
       type: Boolean,
-      default: true
+      default: true,
     },
     useCapture: {
       type: Boolean,
-      default: false
+      default: false,
     },
     isShowMod: {
       type: Boolean,
-      default: false
+      default: false,
     },
     unloadMoreTxt: {
       type: String,
-      default: '哎呀,这里是底部了啦'
+      default: '哎呀,这里是底部了啦',
     },
     scrollChange: {
-      type: Function
-    }
+      type: Function,
+    },
+    containerId: {
+      type: String,
+      default: '',
+    },
   },
   data() {
     return {
@@ -51,11 +55,11 @@ export default {
       startY: 0,
       diffX: 0,
       diffY: 0,
-      beforeScrollTop: 0
+      beforeScrollTop: 0,
     };
   },
 
-  mounted: function() {
+  mounted: function () {
     const parentElement = this.getParentElement(this.$el);
     let scrollEl = window;
     if (this.useWindow === false) {
@@ -81,6 +85,9 @@ export default {
       this.diffY = endY - this.startY;
     },
     getParentElement(el) {
+      if (this.containerId) {
+        return document.querySelector(`#${this.containerId}`);
+      }
       return el && el.parentNode;
     },
     scrollListener() {
@@ -93,7 +100,7 @@ export default {
         window.requestAnimationFrame ||
         window.webkitRequestAnimationFrame ||
         window.mozRequestAnimationFrame ||
-        function(callback) {
+        function (callback) {
           window.setTimeout(callback, 1000 / 60);
         }
       );
@@ -143,7 +150,7 @@ export default {
       this.beforeScrollTop = windowScrollTop;
 
       return offsetDistance <= this.threshold && windowScrollTop >= this.beforeScrollTop;
-    }
+    },
   },
 
   activated() {
@@ -162,6 +169,6 @@ export default {
   destroyed() {
     this.scrollEl.removeEventListener('scroll', this.handleScroll, this.useCapture);
     window.removeEventListener('resize', this.handleScroll, this.useCapture);
-  }
+  },
 };
 </script>