فهرست منبع

修改获取表格高度自定义指令

zhuliu 1 سال پیش
والد
کامیت
35707dc326
2فایلهای تغییر یافته به همراه20 افزوده شده و 2 حذف شده
  1. 19 1
      src/utils/direct/index.js
  2. 1 1
      src/views/project/components/view/table.vue

+ 19 - 1
src/utils/direct/index.js

@@ -61,8 +61,26 @@ const disabled = (el,binding)=>{
 //获取高度
 const DivHeight={
     inserted(el,binding){
+      if(el){
+        let height = window.innerHeight
         binding.value(el.offsetHeight - 10)
-    }
+        window.addEventListener('resize',()=>{
+          let newHeight = window.innerHeight; 
+          if (newHeight !== height) {  
+            binding.value(el.offsetHeight - 10) 
+            height = newHeight;
+          }
+          
+        })
+      }
+    },
+    unbind(el,binding){
+      if(el){
+        window.removeEventListener('resize',()=>{
+          binding.value(el.offsetHeight - 10)
+        })
+      }
+    },
 }
 
 //等高

+ 1 - 1
src/views/project/components/view/table.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="height_100"  v-DivHeight="getDivHeight">
       <el-table :data="tableData" border style="width: 100%" header-row-class-name="custom-table-header"
-      v-if="showTable" :maxHeight="tableHeight" @sort-change="sortChange"  v-el-table-infinite-scroll="getList" :infinite-scroll-distance="10" 
+      v-if="showTable" :height="tableHeight" @sort-change="sortChange"  v-el-table-infinite-scroll="getList" :infinite-scroll-distance="10" 
         :infinite-scroll-disabled="disabled">
         <el-table-column label="#" width="60" type="index" align="center">
           <template slot-scope="scope">