Bootstrap Table自定义排序器如何访问行属性？无需切换至Bootstrap Datatable

嘿，完全不用纠结切换组件！其实Bootstrap Table的自定义排序器悄悄支持传递完整的行数据，只是官方文档没明确写全。直接修改你的排序器函数，接收额外的行对象参数就行，完全不用动现有代码结构。

最优实现方案 #

直接更新你的自定义排序器，增加rowA和rowB两个参数，就能直接访问行属性了：

function customSorter(fieldA, fieldB, rowA, rowB) {
  // 优先处理标记为important的行：让true的始终排在前面
  if (rowA.important && !rowB.important) {
    return -1; // rowA排前
  }
  if (!rowA.important && rowB.important) {
    return 1; // rowB排前
  }
  
  // 保留你原本的价格排序逻辑
  const priceA = parseFloat(fieldA);
  const priceB = parseFloat(fieldB);
  return priceA - priceB;
}

你的字段配置完全不需要改动，还是原来的写法：

{
  field: 'price',
  title: 'prices',
  sortable: true,
  sorter: "customSorter"
}

原理说明 #

Bootstrap Table内部调用自定义排序器时，会自动把当前比较的两个完整行对象作为第三、第四个参数传递进去——哪怕文档没标注。这样你既能实现important行置顶的需求，又能保留原有的字段排序规则，完美适配现有代码。

备用方案（旧版本兼容） #

如果你的Bootstrap Table版本比较旧，不支持直接传递行参数，可以用闭包保存表格数据的方式：

1. 初始化表格时，把数据源存到闭包变量里：

const tableData = [...你的原始数据源];
$('#your-table').bootstrapTable({
  data: tableData,
  columns: [
    // 其他列配置
    {field: 'price', title: 'prices', sortable: true, sorter: customSorter}
  ]
});

2. 在排序器里通过字段值匹配对应的行（建议每行有唯一id字段，避免重复值匹配错误）：

function customSorter(fieldA, fieldB) {
  // 找到对应的行（假设行数据有唯一id）
  const rowA = tableData.find(row => row.price === fieldA);
  const rowB = tableData.find(row => row.price === fieldB);
  
  // 同样处理important置顶逻辑
  if (rowA.important && !rowB.important) return -1;
  if (!rowA.important && rowB.important) return 1;
  
  // 原价格排序逻辑
  return parseFloat(fieldA) - parseFloat(fieldB);
}

第一种方案几乎零改动，建议优先尝试。

内容的提问来源于stack exchange，提问作者Titouan Pautier