如何禁用ag-Grid点击列cellRenderer时触发的多列排序

ag-Grid排序异常解决方案 #

你遇到的是ag-Grid默认多列排序规则与列定义初始排序配置叠加导致的异常，可通过以下两种方案解决：

• 方案一（推荐，最简适配）：直接禁用全局多列排序
  在ag-Grid的gridOptions配置中添加suppressMultiSort: true属性即可。该配置开启后，点击任意列排序都会自动清除其他列的排序状态，仅保留当前点击列的排序效果，同时不会影响初始化时设置的Name列默认排序展示。
  示例配置：

const gridOptions = {
  // 保留原有其他配置
  suppressMultiSort: true,
  columnDefs: [
    { headerName: "Name", field: "name", sort: "desc" },
    // 其余列配置保持不变
  ]
}

• 方案二：调整初始排序设置方式（适用于需要保留多列排序能力的场景）
  如果需要保留多列排序能力（按住Ctrl点击列可叠加排序），则不要将默认排序规则写在列定义的sort属性中，改为在grid初始化完成的gridReady事件中调用API设置初始排序即可：
  示例代码：

// grid初始化完成回调
const onGridReady = (params) => {
  params.api.setSortModel([
    { colId: 'name', sort: 'desc' }
  ])
}

// 列定义去掉sort属性
const columnDefs = [
  { headerName: "Name", field: "name" },
  // 其余列配置保持不变
]

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