【vxe-table】自定义表头列是否可以排序

最新推荐文章于 2024-11-28 11:05:35 发布

春晓_春眠花落

最新推荐文章于 2024-11-28 11:05:35 发布

阅读量1.6k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： vxe-table 文章标签： vue.js

本文链接：https://blog.csdn.net/weixin_49668076/article/details/130411576

vxe-table 专栏收录该内容

7 篇文章

订阅专栏

文章讲述了在使用vxe-table时遇到的指定列排序问题。作者提到vxe-table虽然文档详细但社区支持较少，遇到问题解决途径有限。通过探索，发现可以通过在column上设置sortable属性来控制列是否允许排序，并提供了一个判断函数isShowSort来动态设置该属性，实现了根据字段状态决定列是否可排序的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vxe-table真是让人又爱又恨，官网示例还有文档都很详细，但是可能是用的人少，每次遇到问题，都百度不到啥解决方法，不像el-table,全是方法

今天给我提了个bug，vxe-table要支持指定列排序，意思就是根据某个字段的状态，符合状态的列可以排序，不符合的不允许排序

vxe-table封装成组件了

在这里插入图片描述
vxe-table和el-table有个很大的区别，就是vex-table有很多的配置项，圈起来的sort-config就是排序配置项

我一开始的思路有点问题，我想着把这个showIcon改为false，是不是能解决，答案是不能，它控制的是一整个表头的排序图标是否显示或隐藏，这里卡了一下，然后翻看示例，发现column上有个sortable

在这里插入图片描述

Role列没有sortable，所以没有排序的图标，嗯，对，就是它了
在这里插入图片描述

  filters: {
    // 是否显示排序
    isShowSort(v) {
      let str = ''  
      if (v.sort == '1') {
        str = false
      } else {
        str = true
      }
      return str
    },

  },