关于vue.js:element中table高度自适应

vue+element 中 table 高度自适应

1. 开发环境 vue+element
2. 电脑系统 windows10 专业版
3. 在开发的过程中, 咱们常常会应用到 element 中的 table, 然而咱们也发现了在 table 的配置中, 只能设置 具体的高度不能设置百分比, 怎么实现 table 高度自适应呢? 办法如下:
4. 在对应的 vue 模板中增加如下代码:

<el-table
                  :data="tableData"
                  row-key="id"
                  sortable
                  style="width: 96%"
                  :height="taheight"
                  default-expand-all
                >
                </el-table>

5. 在 return 中增加如下代码:

taheight:"90%",

6. 在 mounted 中增加如下代码:

 _Dchen.$nextTick(() => {this.taheight = (window.innerHeight-this.ttaheight/2)+"%";
    })

7. 效果图如下:

8. 本期的教程到了这里就完结啦, 是不是很 nice, 让咱们一起致力走向巅峰!