Browse Source

优化组件逻辑

zhaoxiaohai 2 years ago
parent
commit
c0aa66f302
3 changed files with 28 additions and 28 deletions
  1. 19 26
      components/Yl_ListBox/index.js
  2. 8 2
      components/Yl_ListBox/index.scss
  3. 1 0
      components/Yl_ListBox/index.wxml

+ 19 - 26
components/Yl_ListBox/index.js

@@ -1,37 +1,22 @@
-// components/My_listBox/index.js
-
+import {
+    getHeight
+} from "../../utils/GetRheRemainingHeight";
 Component({
-    /**
-     * 组件的属性列表
-     */
     properties: {
-        height: {
-            type: Number,
-            value: 0
-        },
-        getlist: {
-            type: Function
+        height: Number, //组件高度
+        getlist: Function,
+        pullDown: { //是否开启下拉
+            type: Boolean,
+            value: true
         },
-        pullDown: {
+        safety: { //适配苹果底部安全距离
             type: Boolean,
             value: true
-        }
-    },
-
-    lifetimes: {
-        ready() {}
+        },
     },
-
-    /**
-     * 组件的初始数据
-     */
     data: {
-        inRefresh: false
+        inRefresh: false, //下拉开启自定义项
     },
-
-    /**
-     * 组件的方法列表
-     */
     methods: {
         /* 下拉刷新 */
         pullToRefresh() {
@@ -52,5 +37,13 @@ Component({
         loadThePage() {
             this.triggerEvent("getlist", false)
         },
+        /* 设置组件高度 */
+        setHeight(element, that) {
+            getHeight(element, that).then(res => {
+                if (this.data.height != res) this.setData({
+                    height: res
+                })
+            });
+        }
     }
 })

+ 8 - 2
components/Yl_ListBox/index.scss

@@ -1,4 +1,10 @@
-/* components/My_listBox/index.wxss */
-.scroll-view{
+.scroll-view {
     position: relative;
+}
+
+/* 适配苹果手机底部安全距离 */
+.safety {
+    box-sizing: border-box;
+    height: constant(safe-area-inset-bottom);
+    height: env(safe-area-inset-bottom);
 }

+ 1 - 0
components/Yl_ListBox/index.wxml

@@ -1,3 +1,4 @@
 <scroll-view class="scroll-view" scroll-y refresher-enabled='{{pullDown}}' refresher-triggered='{{inRefresh}}' style="height: {{height}}rpx;" triggered='{{true}}' bindrefresherrefresh='pullToRefresh' bindscrolltolower='loadThePage'>
     <slot />
+    <view class="safety" wx:if="{{safety}}" />
 </scroll-view>