Bootstrap Table 的 data-sortable="true" 无反应，根本原因是未引入 bootstrap-table-sortable.js 插件或初始化时未启用排序；需正确加载插件、设置列属性、配置 sidePagination 和 onSort 回调，并注意图标样式与中文/数字排序逻辑。
Bootstrap Table 的 data-sortable="true" 为什么没反应
根本原因通常是没引入 bootstrap-table-sortable.js 插件，或者表格初始化时没启用排序功能。bootstrap table 的基础版（bootstrap-table.min.js）默认不包含排序逻辑，必须显式加载扩展。
- 确认 HTML 中已加载：
bootstrap-table-sortable.min.js（注意不是bootstrap-table.min.js单文件） - 在
table标签里为需要排序的列加上data-sortable="true"，例如：<th data-field="name" data-sortable="true">姓名</th> - 初始化时确保传入
sortName和sortOrder（哪怕为空），否则部分版本会跳过排序初始化 - 如果用的是 Bootstrap 5 + Bootstrap Table 1.22+，注意插件名可能变为
extensions/sortable/bootstrap-table-sortable.js，路径别写错
点击表头后排序图标不显示或错位
图标依赖 Font Awesome 或内置 SVG，但默认样式容易被项目 CSS 覆盖，尤其当用了自定义 icon font 或重置了 ::before 伪元素。
- 检查是否漏加 Font Awesome：Bootstrap Table 旧版（v1.18 之前）依赖
fa-sort、fa-sort-up等类，需引入font-awesome.min.css - 新版（v1.19+）默认用 SVG，但若页面有全局
svg { display: none }或pointer-events: none，图标就不可见 - 排序图标容器是
.bootstrap-table .th-inner .sortable，可临时加调试样式：border: 1px solid red看是否渲染了 - 不要手动给
th设position: relative之类，会干扰图标绝对定位
后端分页时点击排序没触发请求
这是最常踩的坑：前端排序和后端排序是两套逻辑，data-sortable="true" 默认只做前端内存排序；要让点击发请求，必须配置 sidePagination: 'server' 并监听 onSort 事件手动刷新。
- 确认
data-side-pagination="server"已设，且初始化时传入sidePagination: 'server' - 必须实现
onSort回调，在里面更新queryParams并调用$table.bootstrapTable('refresh') -
queryParams函数里要返回sort和order字段，例如：return { sort: params.sort, order: params.order } - 后端接口必须能接收这两个参数，并按对应字段执行 SQL
ORDER BY，否则前端点了也白点
中文字段排序乱序或大小写敏感
JavaScript 原生 String.prototype.localeCompare() 在不同浏览器对中文支持不一致，而 Bootstrap Table 前端排序直接用它，默认不开启 locale 感知。
- 强制指定语言环境：
data-sorter="function(a, b) { return a.localeCompare(b, 'zh-CN'); }"，写在th上 - 若需忽略大小写，改用：
a.toString().toLowerCase().localeCompare(b.toString().toLowerCase(), 'zh-CN') - 数字字符串（如 "10", "2"）会被当文本排成 "10" data-sorter="parseInt" 或自定义函数转 Number
- 时间字符串建议先统一转为
new Date().getTime()再比，避免格式差异（"2023-01-01" vs "01/01/2023"）
