VUE Table 尾行进行合计处理，并进行合并列处理

最新推荐文章于 2024-07-23 17:37:58 发布

wj196

最新推荐文章于 2024-07-23 17:37:58 发布

阅读量1k

点赞数 8

CC 4.0 BY-SA版权

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/wj196/article/details/135239948

需求效果图如下：

实现代码：

  <el-form
        ref="edit"
        label-position="right"
        :model="form"
        :rules="rules"
        size="small"
      >
        <div id="tableData">
          <el-table
            id="table"
            :key="Math.random()"
            ref="tableSort"
            v-loading="listLoading"
            border
            :data="form.weaveList"
            :header-cell-style="{ 'text-align': 'center' }"
            row-key="weaveId"
            show-summary
            size="mini"
            :span-method="objectSpanMethod"
            :summary-method="getSummaries"
          >
            <el-table-column
              :label="translate('product.weave.standards')"
              min-width="120"
            >
              <el-table-column
                align="center"
                :label="translate('product.weave.project')"
                min-width="120"
              >
                <template slot-scope="scope">
                  <el-form-item
                    :prop="'weaveList.' + scope.$index + '.weaveName'"
                    :rules="rules.weaveName"
                  >
                    <e