Просмотр исходного кода

Merge pull request #2396 from QingWei-Li/fix/table/nodata-width

Table: fix body width when no data
baiyaaaaa 8 лет назад
Родитель
Сommit
5af2d39714
1 измененных файлов с 7 добавлено и 2 удалено
  1. 7 2
      packages/table/src/table.vue

+ 7 - 2
packages/table/src/table.vue

@@ -31,9 +31,9 @@
         :row-class-name="rowClassName"
         :row-style="rowStyle"
         :highlight="highlightCurrentRow"
-        :style="{ width: layout.bodyWidth ? layout.bodyWidth - (layout.scrollY ? layout.gutterWidth : 0 ) + 'px' : '' }">
+        :style="{ width: bodyWidth }">
       </table-body>
-      <div class="el-table__empty-block" v-if="!data || data.length === 0">
+      <div :style="{ width: bodyWidth }" class="el-table__empty-block" v-if="!data || data.length === 0">
         <span class="el-table__empty-text"><slot name="empty">{{ emptyText || t('el.table.emptyText') }}</slot></span>
       </div>
     </div>
@@ -297,6 +297,11 @@
         return style;
       },
 
+      bodyWidth() {
+        const { bodyWidth, scrollY, gutterWidth } = this.layout;
+        return bodyWidth ? bodyWidth - (scrollY ? gutterWidth : 0) + 'px' : '';
+      },
+
       fixedBodyHeight() {
         let style = {};