From 8d3bc85c461a379edf6c4b4b21ba8298f5cf5de6 Mon Sep 17 00:00:00 2001
From: zhouyuntao <zz__mx@yeah.net>
Date: Thu, 14 Mar 2019 11:22:03 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=20el-table=20=E8=87=AA?=
 =?UTF-8?q?=E9=80=82=E5=BA=94=E9=AB=98=E5=BA=A6=E6=8C=87=E4=BB=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/directive/el-table/adaptive.js | 55 +++++++++++++++++++++++-------
 1 file changed, 42 insertions(+), 13 deletions(-)

diff --git a/src/directive/el-table/adaptive.js b/src/directive/el-table/adaptive.js
index afa3d1af..4db5f3ae 100644
--- a/src/directive/el-table/adaptive.js
+++ b/src/directive/el-table/adaptive.js
@@ -1,32 +1,61 @@
 
+import { addResizeListener, removeResizeListener } from 'element-ui/src/utils/resize-event';
+
+/**
+ * 用法
+ * <el-table height="50" ref="table" v-el-height-adaptive-table="{table: $refs.table}">...</el-table>
+ * 必须设置 height,可以任意值
+ */
 export default{
+  bind(el, binding, vnode, oldVnode) {
+    el.data = {}
+    el.resizeListener = () => {
+      let data = el.data
+
+      if (!data.table) {
+        return
+      }
+      let height = window.innerHeight - el.offsetTop - data.bottomHeight - data.topHeight;
+
+      data.table.layout.setHeight(height)
+      data.table.doLayout()
+    }
+    addResizeListener(el, el.resizeListener)
+  },
   /**
-   * 仅当 el-table :data属性为动态加载（不包括computed）才会触发此事件，且 已为 el-table 设置  height 的初始值(任何值)  此指令才起作用
+   *
    * @param {*} el
    * @param {*} binding
    * binding.value 格式为 {
    *      table: $refs.table, //  表格对象
-   *      topHeight: 10      //  表格顶边 距离顶部高度，默认值为  10
-   *      footerHeight: 10   //  表格底部 距离底部高度，默认值为  10
+   *      topHeight: 140      //  表格顶边 距离顶部高度，默认值为  140
+   *      bottomHeight: 120   //  表格底部 距离底部高度，默认值为  120
    * }
    * @param {*} vnode
    * @param {*} oldVnode
    */
   update(el, binding, vnode, oldVnode) {
-    let topHeight = binding.value.topHeight ? binding.value.topHeight : 10
-    let footerHeight = binding.value.footerHeight ? binding.value.footerHeight : 10
+    if (el.heightInited) {
+      return
+    }
+    let topHeight = binding.value.topHeight ? binding.value.topHeight : 140
+    let bottomHeight = binding.value.bottomHeight ? binding.value.bottomHeight : 120
 
     let table = binding.value.table
 
-    let tableHeight = window.innerHeight - el.offsetTop - footerHeight - topHeight;
-    table.layout.setHeight(tableHeight)
+    el.data.table = table
+    el.data.topHeight = topHeight
+    el.data.bottomHeight = bottomHeight
+
+    let height = window.innerHeight - el.offsetTop - bottomHeight - topHeight
+
+    table.layout.setHeight(height)
     table.doLayout()
 
-    // 监听窗口大小变化
-    window.addEventListener("resize", () => {
-      tableHeight = window.innerHeight - el.offsetTop - footerHeight - topHeight
-      table.layout.setHeight(tableHeight)
-      table.doLayout()
-    })
+    el.heightInited = true;
+
+  },
+  unbind(el) {
+    removeResizeListener(el, el.resizeListener)
   }
 }