el-table form adds show-summary to the end of the total, form misalignment and height calculation error

After element-UI’s el-table form adds show-summary to the end of the table, there will be a calculation height error in the body of the form, and the height of the total row will not be subtracted, so you need to customize the height of the form body.

tips#Execute each time the form data is obtained

//表单总高度
let tableHeight = document.getElementsByClassName('el-table')[0].offsetHeight
//表头高度
let headerHeight = document.getElementsByClassName('el-table__header-wrapper')[0].offsetHeight
//要等表单渲染完成后才能拿到合计行的高度
this.$nextTick(()=>{
	//合计行高度
	let footerHeight = document.getElementsByClassName('el-table__footer-wrapper')[0].offsetHeight
	//设置表单正文高度
	document.getElementsByClassName('el-table__body-wrapper')[0].style.height = tableHeight - headerHeight - footerHeight + 'px'
})

Guess you like

Origin blog.csdn.net/weixin_43968658/article/details/102709820