element-ui2表格排序如何排除某行不排序问题

clipboard.png
假如一个表格样子大概如上图,小计,合计是自己算出来的。标题1,标题2可以点击进行排序,但是排序要保持小计,合计位置不变
我试过了几种方法

  1. tableData push了小计和合计,但是这种点排序会把小计和总计一起排序
<el-table
        :data="tableData"
  1. 使用summary-method,但是这个貌似只能添加一个数组而已,不能把小计和总计一起添加进行。这种方法点击排序不会把小计和总计一起排序
<el-table
        show-summary
        :summary-method="summaryMethod"
        :data="tableData"
  1. tableData push了小计和合计, 在点击的时候把小计和总计splice掉,然后在push进去,但是还是会把他们进行排序
<el-table
        :data="tableData"
        border
        @sort-change="handleSortChange"
        
 handleSortChange (val) {
      setTimeout(() => {
        let l = this.tableData.findIndex(items => items.regType === '小计')
        let c = this.tableData.findIndex(items => items.regType === '总计')
        let lobj = {}
        let cobj = {}
        if (l > -1) {
          lobj = {...this.tableData[l]}
          this.tableData.splice(l, 1)
        }
        if (c > -1) {
          cobj = {...this.tableData[c]}
          this.tableData.splice(c, 1)
        }
        if (Object.keys(lobj).length > 0) {
          this.tableData.push(lobj)
        }
        if (Object.keys(cobj).length > 0) {
          this.tableData.push(cobj)
        }
      }, 0)
    },
  1. :sort-method="sortMethod" 估计还是这样
  2. 使用slot="append", ,但是添加上去的不是添加在table tbody后面,至少2.X不可以。 1.X确实可以保持与表格一致的,且可以点击排序但不包含小计和总计

请教各位有没有其他方法呢

阅读 5k
1 个回答

sortable设置为'custom'

监听 Table 的 sort-change 事件,根据事件的参数来对tableData进行排序就行了

custom不会调用el-table本身的排序方法

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题