浏览代码

高度获取

liushengqiang 1 年之前
父节点
当前提交
8556273aa0
共有 2 个文件被更改,包括 31 次插入26 次删除
  1. 27 22
      src/components/m-sticky/index.tsx
  2. 4 4
      src/views/schedule-manage/index.module.less

+ 27 - 22
src/components/m-sticky/index.tsx

@@ -63,31 +63,36 @@ export default defineComponent({
       } else {
         forms.divStyle.bottom = props.offsetBottom || '0px';
       }
-
-      nextTick(() => {
-        // 为了处理刚开始头部高度为0的情况
-        if (divRef.value) {
-          const { height } = useRect(divRef.value);
+      const resize = new ResizeObserver(() => {
+        const { height } = useRect(divRef.value);
           __initHeight(height);
+      })
+      resize.observe(divRef.value);
+
+      // nextTick(() => {
+      //   // 为了处理刚开始头部高度为0的情况
+      //   if (divRef.value) {
+      //     const { height } = useRect(divRef.value);
+      //     __initHeight(height);
 
-          setTimeout(() => {
-            const { height } = useRect(divRef.value);
-            // 判断获取的高度是否一致,如果一致则不做处理
-            if (height === forms.heightV) return;
-            __initHeight(height);
-          }, 200);
-        }
+      //     setTimeout(() => {
+      //       const { height } = useRect(divRef.value);
+      //       // 判断获取的高度是否一致,如果一致则不做处理
+      //       if (height === forms.heightV) return;
+      //       __initHeight(height);
+      //     }, 200);
+      //   }
 
-        // 为了处理头部第一次获取高度不对的问题
-        if (div2Ref.value) {
-          setTimeout(() => {
-            const { height } = useRect(div2Ref.value);
-            if (height !== forms.heightV && props.position === 'top') {
-              __initHeight(height);
-            }
-          }, 1000);
-        }
-      });
+      //   // 为了处理头部第一次获取高度不对的问题
+      //   if (div2Ref.value) {
+      //     setTimeout(() => {
+      //       const { height } = useRect(div2Ref.value);
+      //       if (height !== forms.heightV && props.position === 'top') {
+      //         __initHeight(height);
+      //       }
+      //     }, 1000);
+      //   }
+      // });
     });
 
     watch(

+ 4 - 4
src/views/schedule-manage/index.module.less

@@ -4,10 +4,10 @@
       position: fixed;
       left: 0;
       right: 0;
-      top: var(--van-nav-bar-height);
+      top: var(--header-height);
     }
     .van-swipe-item{
-      height: calc(100vh - var(--van-nav-bar-height) - var(--van-tabs-line-height));
+      height: calc(100vh - var(--header-height) - var(--van-tabs-line-height));
       overflow-y: auto;
     }
     .van-tab__panel {
@@ -30,9 +30,9 @@
 
 .list {
   padding: 12px;
-  height: calc(100vh - var(--van-nav-bar-height) - var(--van-tabs-line-height) - 60px);
+  min-height: calc(100vh - var(--header-height) - var(--van-tabs-line-height) - 60px);
   &.todo{
-    height: calc(100vh - var(--van-nav-bar-height) - var(--van-tabs-line-height));
+    height: calc(100vh - var(--header-height) - var(--van-tabs-line-height));
   }
   &::-webkit-scrollbar {
     display: none;