解决el-table中文按拼音排序和英文大小写排序问题


el-table排序默认是使用的unicode编码,在中文排序或英文大小写混用的情况下需要我们手动自己处理。

  • 中文排序,我们想要按照拼音顺序排列,需要用到javascript的  localeCompare  方法。
    // dom编写
    <el-table-column prop="name" label="名称" align="center" :sortable="true" :sort-method="sortName" />
    // methods中方法定义
    sortAuthor(a, b) {
       return a.name.localeCompare(b.name)
    }
  • 英文大小写均存在时排序,例如自带的排序升序时,会按照unicode编码先排大写然后小写,如果我们想要忽略大小写排序时需要自定义方法如下:
    // dom编写
    <el-table-column prop="englishName" label="英文名称" align="center" :sortable="true" :sort-method="sortEnglishName" />
    // methods中方法定义
    sortEnglishName(a, b) {
       let res = 0
       const char1 = a.englishName.toUpperCase()
       const char2 = b.englishName.toUpperCase()
       res = char1.charCodeAt(0) - char2.charCodeAt(0)
       return res
    }

     


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM