| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 | 
							- export default {
 
-   created() {
 
-     this.tableLayout.addObserver(this);
 
-   },
 
-   destroyed() {
 
-     this.tableLayout.removeObserver(this);
 
-   },
 
-   computed: {
 
-     tableLayout() {
 
-       let layout = this.layout;
 
-       if (!layout && this.table) {
 
-         layout = this.table.layout;
 
-       }
 
-       if (!layout) {
 
-         throw new Error('Can not find table layout.');
 
-       }
 
-       return layout;
 
-     }
 
-   },
 
-   mounted() {
 
-     this.onColumnsChange(this.tableLayout);
 
-     this.onScrollableChange(this.tableLayout);
 
-   },
 
-   updated() {
 
-     if (this.__updated__) return;
 
-     this.onColumnsChange(this.tableLayout);
 
-     this.onScrollableChange(this.tableLayout);
 
-     this.__updated__ = true;
 
-   },
 
-   methods: {
 
-     onColumnsChange(layout) {
 
-       const cols = this.$el.querySelectorAll('colgroup > col');
 
-       if (!cols.length) return;
 
-       const flattenColumns = layout.getFlattenColumns();
 
-       const columnsMap = {};
 
-       flattenColumns.forEach((column) => {
 
-         columnsMap[column.id] = column;
 
-       });
 
-       for (let i = 0, j = cols.length; i < j; i++) {
 
-         const col = cols[i];
 
-         const name = col.getAttribute('name');
 
-         const column = columnsMap[name];
 
-         if (column) {
 
-           col.setAttribute('width', column.realWidth || column.width);
 
-         }
 
-       }
 
-     },
 
-     onScrollableChange(layout) {
 
-       const cols = this.$el.querySelectorAll('colgroup > col[name=gutter]');
 
-       for (let i = 0, j = cols.length; i < j; i++) {
 
-         const col = cols[i];
 
-         col.setAttribute('width', layout.scrollY ? layout.gutterWidth : '0');
 
-       }
 
-       const ths = this.$el.querySelectorAll('th.gutter');
 
-       for (let i = 0, j = ths.length; i < j; i++) {
 
-         const th = ths[i];
 
-         th.style.width = layout.scrollY ? layout.gutterWidth + 'px' : '0';
 
-         th.style.display = layout.scrollY ? '' : 'none';
 
-       }
 
-     }
 
-   }
 
- };
 
 
  |