Table 组件优化复杂表头行合并时，会添加空行

Author: 黄书伟

packages/v-table/src/frozen-columns-mixin.js

@@ -15,7 +15,7 @@ export default {
         },
         // 冻结的表头列集合
         frozenTitleCols(){
-            var frozenTitleCols = [];
+            var frozenTitleCols = [], self = this;
 
             if (this.internalTitleRows.length > 0) {
 
@@ -31,16 +31,29 @@ export default {
                             }
                         }
                     })
+
                     if (frozenTitleRows.length > 0) {
+
                         frozenTitleCols.push(frozenTitleRows);
+
+                        var minRowspan = self.getMinRowspan(frozenTitleRows);
+
+                        if (minRowspan && minRowspan > 0) {
+
+                            for (var i = 0; i < minRowspan; i++) {
+
+                                frozenTitleCols.push([]);
+                            }
+                        }
                     }
                 })
             }
+
             return frozenTitleCols;
         },
         // 未的表头列集合
         noFrozenTitleCols(){
-            var noFrozenTitleCols = [];
+            var noFrozenTitleCols = [], self = this;
 
             if (this.internalTitleRows.length > 0) {
 
@@ -57,12 +70,20 @@ export default {
 
                     if (noFrozenTitleRows.length > 0) {
                         noFrozenTitleCols.push(noFrozenTitleRows);
+
+                        var minRowspan = self.getMinRowspan(noFrozenTitleRows);
+
+                        if (minRowspan && minRowspan > 0) {
+
+                            for (var i = 0; i < minRowspan; i++) {
+
+                                noFrozenTitleCols.push([]);
+                            }
+                        }
                     }
                 })
             }
             return noFrozenTitleCols;
-        },
-
-
+        }
     }
 }

packages/v-table/src/table.vue

@@ -15,7 +15,7 @@
                                 <tr v-for="row in frozenTitleCols">
                                     <td v-for="col in row"
                                         :class="[col.titleCellClassName]"
-                                        :colspan="col.colspan" :rowspan="dealTitleRowspan(row,col.rowspan)"
+                                        :colspan="col.colspan" :rowspan="col.rowspan"
 
                                         @mousemove.stop="handleTitleMouseMove($event,col.fields)"
                                         @mousedown.stop="handleTitleMouseDown($event)"
@@ -177,7 +177,7 @@
                             <tr v-for="row in noFrozenTitleCols">
                                 <td v-for="col in row"
                                     :class="[col.titleCellClassName]"
-                                    :colspan="col.colspan" :rowspan="dealTitleRowspan(row,col.rowspan)"
+                                    :colspan="col.colspan" :rowspan="col.rowspan"
                                     @mousemove.stop="handleTitleMouseMove($event,col.fields)"
                                     @mousedown.stop="handleTitleMouseDown($event)"
                                     @mouseout.stop="handleTitleMouseOut()"
@@ -587,6 +587,7 @@
             bodyViewHeight(){
                 var result;
                 if (this.internalTitleRows.length > 0) {
+
                     result = this.internalHeight - this.titleRowHeight * (this.internalTitleRows.length + this.getTitleRowspanTotalCount);
                 } else {
                     result = this.internalHeight - this.titleRowHeight;

packages/v-table/src/title-cell-merge-mixin.js

@@ -70,31 +70,46 @@ export default {
          * row :行信息
          * rowspan：当前列的rowspan值
          * */
-        dealTitleRowspan(row, rowspan){
+        /*dealTitleRowspan(row, rowspan){
 
-            let result = rowspan,
-                rowspanCountArr,
-                minVal;
+         let result = rowspan,
+         rowspanCountArr,
+         minVal;
 
-            rowspanCountArr = this.getTitleRowspanCountArr(row);
+         rowspanCountArr = this.getTitleRowspanCountArr(row);
 
-            // 如果每一项的rowspan值都大于1则继续处理
-            if (Array.isArray(rowspanCountArr) && rowspanCountArr.length > 0) {
+         // 如果每一项的rowspan值都大于1则继续处理
+         if (Array.isArray(rowspanCountArr) && rowspanCountArr.length > 0) {
 
-                rowspan = parseInt(rowspan);
+         rowspan = parseInt(rowspan);
 
-                minVal = Math.min.apply(null, rowspanCountArr);
+         minVal = Math.min.apply(null, rowspanCountArr);
 
-                if (rowspan === minVal) {
+         if (rowspan === minVal) {
 
-                    result = 1;
-                } else {
+         result = 1;
+         } else {
 
-                    result = rowspan - minVal + 1;
-                }
+         result = rowspan - minVal + 1;
+         }
+         }
+         return result;
+         },*/
+
+        // 获取最小的 rowspan
+        getMinRowspan(row){
+
+            let result;
+
+            let rowspanCountArr = this.getTitleRowspanCountArr(row);
+
+            // 如果每一项的rowspan值都大于1则继续处理
+            if (Array.isArray(rowspanCountArr) && rowspanCountArr.length > 0) {
+
+                result = Math.min.apply(null, rowspanCountArr);
             }
-            return result;
-        },
+            return result - 1;
+        }
     }
 
 }