vue界面中，在表格el-table的下方再自定义添加一个表格或多个表格

最新推荐文章于 2024-02-20 16:38:55 发布

小王姑娘0201

最新推荐文章于 2024-02-20 16:38:55 发布

阅读量1k

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qq_45310503/article/details/131452253

版权

如下图页面vue中有多个列表el-table

实现方法

<el-table
  :data="tableData"
  :span-method="getSpanArr"
  border
  style="width: 100%">
  <el-table-column
    prop=""
    label="项目"
    align="center"
    width="180">
  </el-table-column>
...
  <div slot="append" style="text-align: center">
    <el-table :data="" style="width: 100%" :show-header="false">
      <el-table-column align="center" width="180" prop="remark"></el-table-column>
      ...
    </el-table>

    <el-table :data="" border :show-header="false">
      <el-table-column align="center" width="180" prop="remark" label="备注">
      </el-table-column>
    ...
    </el-table>
  </div>

</el-table>

:data="" 里面是数组

:show-header="false" 隐藏表头

el-table中也可以世界设置合计行但是合计行会在自定义表格的后面，如果不想再自定义表格后面，就需要将合计行也进行自定义