Element ui表格高度自适应

element-ui表格高度自适应

1.动态绑定table的高度值

:height

<el-table :data="List" :height='tableHeight' stripe border highlight-current-row>

2.获取浏览器高度，并监听浏览器resize变化

mounted () {
	getHeight()
    //增加监听事件，窗口变化时得到高度。
    window.addEventListener('resize',this.getHeight,false)
},
methods:{
    getHeight(){
    //获取浏览器高度并计算得到表格所用高度。
        this.tableHeight=document.documentElement.clientHeight-270
      }, 
}

3.扩展

获取当前浏览器高度

document.documentElement.clientHeight

获取当前浏览器宽度

document.documentElement.clientWidth