<el-table :data="form.tableData" ref="table" tooltip-effect="dark" border height="100%" @selection-change='selectRow'> <el-table-column label="项目" align="right"> <el-table-column prop="name" label="数量"> <el-table-column width="150" prop="month" label="月份"> <template slot-scope="scope"> <el-form-item :prop="'tableData.' + scope.$index + '.taskCode'"> <el-input v-model="scope.row.new_exceptQuota" :disabled="requestStatus == 'detail'" clearable> </el-input> </el-form-item> </template> </el-table-column> </el-table-column> </el-table-column> <el-table-column label="右侧大标题" align="center" :key="item"> <el-table-column label="第二行第一列" align="center"> <template slot-scope="scope"> <el-form-item :prop="'tableData.' + scope.$index + '.taskCode'"> <el-input v-model="scope.row.new_exceptQuota" :disabled="requestStatus == 'detail'" clearable> </el-input> </el-form-item> </template> </el-table-column> //多个<el-table-column></el-table-column> </el-table-column> </el-table>
样式部分:
/deep/ .el-table th{ overflow: initial; } /deep/ .el-table thead tr:first-of-type th:first-of-type, /deep/ .el-table thead tr:nth-of-type(2) th:first-of-type{ border-bottom: none; } /deep/ .el-table thead tr:first-of-type th:first-of-type .cell{ text-align: right; } /deep/ .el-table thead tr:nth-of-type(2) th:first-of-type .cell{ padding-left: 0; } /deep/ .el-table thead tr:last-of-type th:first-of-type .cell{ text-align: left; } /deep/ .el-table thead tr:first-of-type th:first-of-type:before, /deep/ .el-table thead tr:last-of-type th:first-of-type:before{ content: ''; position: absolute; width: 1px; background-color: #666; display: block; } /deep/ .el-table thead tr:first-of-type th:first-of-type:before { height: 198px; //根据情况调整 top: 0; left: 39px; //根据情况调整 transform: rotate(-34deg); //根据情况调整 transform-origin: top; z-index: 2; } /deep/ .el-table thead tr:last-of-type th:first-of-type:before { height: 183px; //根据情况调整 bottom: 0; right: 0; //根据情况调整 transform: rotate(-54deg); //根据情况调整 transform-origin: bottom; }
转自(8条消息) element table表格表头显示斜杠/斜线_meetAlice的博客-CSDN博客_element表头斜杠