elementui table合并行和列

最新推荐文章于 2024-06-21 17:30:00 发布

科罗拉多

最新推荐文章于 2024-06-21 17:30:00 发布

阅读量360

点赞数

文章标签： elementui vue.js javascript

本文链接：https://blog.csdn.net/guo_2019/article/details/125264113

版权

本文介绍了如何使用Element UI表格组件合并第7和8列的行，通过`objectSpanMethod`函数实现跨行和跨列的合并，适用于数据呈现和布局调整。博主分享了关键代码片段，并参考了相关博客提供了解决方案。

摘要由CSDN通过智能技术生成

elementui table合并行和列

这里合并列号是7和8的所有行

objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      //   row  --- 当前行
      //   column ----当前列
      //   rowIndex --当前行号
      //   columnIndex --当前列号
      if (rowIndex <= 6) {
        if (rowIndex === 0 && (columnIndex === 7 || columnIndex === 8)) {
          return {
            rowspan: 7,  //行
            colspan: 1  //列
          }
        }else if(rowIndex > 0 && (columnIndex === 7 || columnIndex === 8)) {
          return {
            rowspan: 0,  //行
            colspan: 0  //列
          }
        }
      }
    },