html的表格中暂无数据,ElementUI行内条件以及添加“暂无数据”提示

一、添加表格内条件

header-cell-class-name="column-css" border stripe height = "552">

@change="changMethod" @clear="searchClick"

v-if="scope.$index === 0" v-model="filters.signalType">

:label="item.label" :value="item.value">

{{ scope.row.signalTypeId_CN }}

{{$t('kpmg.seeDetails')}}

二、添加表格内无数据提示

watch:{

DataSet: function (val) {

let para = document.createElement("p");

let node = document.createTextNode("暂无数据");

let element = document.getElementsByClassName('currentInfo-table')[0].getElementsByClassName('el-table__body-wrapper')[0];

para.appendChild(node);

para.style.height = "100%";

para.className = "noData";

para.style.textAlign = "center";

para.style.paddingTop = document.getElementById('toolboxcard').clientHeight / 2-250 + 'px';

if (val && val.length <= 1) {

if(!document.getElementsByClassName('currentInfo-table')[0].getElementsByClassName('noData')[0]){

element.appendChild(para);

}

} else {

if (document.getElementsByClassName('currentInfo-table')[0].getElementsByClassName('noData')[0]) {

let pare = document.getElementsByClassName('currentInfo-table')[0].getElementsByClassName('noData')[0];

element.removeChild(pare);

}

}

}

}

三、效果图如下：