element table表格自适应高度

element table表格自适应高度

1.方法

// 路径 -> mixin -> tableAutoHeight.js
const tableAutoHeight = {
    data () {
        return {
            tableHeight: 410,
            cheight: 400
        }
    },
    mounted () {
        this.$nextTick(() => {
            this.tableHeight = document.getElementById('app').offsetHeight - this.cheight;
            window.onresize = () => {
                return (() => {
                    this.tableHeight = document.getElementById('app').offsetHeight - this.cheight;
                })();
            };
        });
    }
}

export default tableAutoHeight;

2.使用

    <el-table
        :data="tableData"
        :height="tableAutoHeight"
        ref="table">
    </el-table>

    import tableAutoHeight from '@/mixin/tableAutoHeight';
    export default {
        mixins: [ tableAutoHeight ],
        /* data () {
            return {
                tableHeight: 410, // 自定义高度- 默认不加
                cheight: 400 // 自定义高度 - 默认不加
            }
        } */
    }