el-table列表自适应页面高度

最近产品经理提了一个需求,当表格超出页面高度时,要固定顶部表头和搜索栏。
所以想到了用el-table的max-height属性去实现。不想用混入,所以使用了组件的方式来实现。
具体代码如下:





使用adjustHeight属性调整

    
        
        
        
        
          
        
		...
      
      

还可以使用 class 来决定要减去的元素高度,组件默认减去的class名称是eng-fix-table-height,可以通过subElementClass来调整
el-table列表自适应页面高度_第1张图片

 // 使用className来减去对应的对象
    subElementClass: {
      type: String,
      default: 'eng-fix-table-height'
    },

你可能感兴趣的:(Element-UI,javascript,前端,vue.js)