element-ui2表格排序如何排除某行不排序问题
假如一个表格样子大概如上图,小计,合计是自己算出来的。标题1,标题2可以点击进行排序,但是排序要保持小计,合计位置不变
我试过了几种方法
- tableData push了小计和合计,但是这种点排序会把小计和总计一起排序
<el-table
:data="tableData"
- 使用summary-method,但是这个貌似只能添加一个数组而已,不能把小计和总计一起添加进行。这种方法点击排序不会把小计和总计一起排序
<el-table
show-summary
:summary-method="summaryMethod"
:data="tableData"
- 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)
},
- :sort-method="sortMethod" 估计还是这样
- 使用slot="append", ,但是添加上去的不是添加在table tbody后面,至少2.X不可以。 1.X确实可以保持与表格一致的,且可以点击排序但不包含小计和总计
请教各位有没有其他方法呢
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
sortable设置为'custom'
监听 Table 的 sort-change 事件,根据事件的参数来对tableData进行排序就行了
custom不会调用el-table本身的排序方法