ag-grid的Cell Click点击事件中如何获取对应列的索引？

ag-grid 没有直接暴露列索引参数是设计使然：框架本身支持列拖拽重排、固定列、动态显隐等特性，列索引属于动态不稳定的值，官方不推荐业务逻辑依赖索引实现，因此没有将其作为默认参数返回。

针对你的场景，有两种可行的实现方案：

方案1：自定义colDef标识（推荐） #

这个方案不受列顺序、显隐状态影响，适配无列头的使用场景，稳定性最高。

• 定义columnDefs时给每列加自定义属性（ag-grid会保留所有用户自定义的colDef字段），用来标记列的业务角色

const columnDefs = [
  {
    // 自定义字段，标记当前列为删除操作列
    colRole: 'delete',
    cellRenderer: () => <button>删除</button>,
    // 其余列配置
  },
  {
    colRole: 'otherAction',
    // 其余列配置
  },
  // 其他列定义
]

• 在onCellClicked回调中直接读取自定义字段走分支逻辑

const onCellClicked = useCallback((params) => {
  const { colDef, data } = params;
  switch(colDef.colRole) {
    case 'delete':
      // 执行删除逻辑，直接使用params.data拿到的完整行数据
      handleDelete(data.id);
      break;
    case 'otherAction':
      // 执行第二列对应业务逻辑
      handleOtherAction(data);
      break;
    default:
      return;
  }
}, [])

方案2：手动计算列索引（仅适合列完全固定的场景） #

如果你的业务逻辑必须依赖列索引，且确认列不会允许拖拽调整顺序、不会动态显隐，可以通过gridApi手动计算当前列的索引：

const onCellClicked = useCallback((params) => {
  const { column, api, data } = params;
  // 拿到当前所有显示列的数组
  const displayedColumns = api.getAllDisplayedColumns();
  // 匹配当前列拿到对应下标
  const colIndex = displayedColumns.findIndex(col => col === column);

  // 按索引走分支逻辑
  if (colIndex === 0) {
    handleDelete(data.id);
  } else if (colIndex === 1) {
    handleOtherAction(data);
  }
}, [])

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