element-ui 中合并表格的总结

合并表头
js 复制代码
   <el-table :span-method="objectSpanMethod" :header-cell-style="headerMethod"/>
   // 合并表头
    headerMethod6({ row, cloumn, rowIndex, columnIndex }) {
      // row数组对应的是每一列
      row[0].colSpan = 0
      row[1].colSpan = 2
      if (columnIndex === 0) {
        return { display: 'none' }
      }
    },
  //  合并单元行和列, rowIndex从除去表头那一行开始数0,1,...
  arraySpanMethod({ row, column, rowIndex, columnIndex }) {
  // 偶数行: 第一列合并右侧的一列,第二列清空
        if (rowIndex % 2 === 0) { 
          if (columnIndex === 0) {
            return [1, 2];  //  { rowspan: 1,colspan: 2};
          } else if (columnIndex === 1) {
            return [0, 0];  // 标识删除该单元格
          }
        }
      },
相关推荐
鹤鸣的日常3 小时前
Vue + element plus 二次封装表格
前端·javascript·vue.js·elementui·typescript
dy17173 天前
el-table表头上下显示内容
javascript·vue.js·elementui
一只小阿乐6 天前
vue3 使用v-model开发弹窗组件
javascript·vue.js·elementui
humors2216 天前
前端开发案例(不定期更新)
前端·vue.js·elementui·ruoyi·若依
阿奇__6 天前
el-table有固定列时样式bug
vue.js·elementui·bug
是大林的林吖9 天前
解决 elementui el-cascader组件懒加载时存在选中状态丢失的问题?
前端·javascript·elementui
鹏仔工作室9 天前
elemetui中el-date-picker限制开始结束日期只能选择当月
前端·vue.js·elementui
竹秋…9 天前
el-table 滚动条小箭头点不了且部分滚动条无法拖动的问题
javascript·vue.js·elementui
一室易安9 天前
模仿elementUI 中Carousel 走马灯卡片模式 type=“card“ 的自定义轮播组件 图片之间有宽度
前端·javascript·elementui
蒲公英源码11 天前
uniapp开源ERP多仓库管理系统
mysql·elementui·uni-app·php