Ag Grid React 防止在单元格单击处理程序中选择行

Question

如何防止在单元格单击处理程序中选择行？

不工作：

onCellClicked={event => {
  if ((event.event?.target as HTMLInputElement).type === 'checkbox') {
      event.event?.stopPropagation();
      event.event?.preventDefault();
      return;
  }
}}

我每行都有复选框（选择行时默认行为选择复选框。我不需要这个）。当我单击我自己的复选框行时也被选中。如何预防这种情况？

Answer 1

Ag-Grid 与我们许多人一样使用一些预定义的 CSS 类，这是我们的起点

虽然有点丑，但是很管用

  onRowSelected: (params) => {
    // we are only interested in selected rows
    if (params.node.selected) {
      // here we search for an html element with class name ag-checked, we are going to remove this class if the row is selected
      const i = params.node.rowIndex;
      const el = document.querySelectorAll(
        '[row-index="' + i + '"] div[ref="eWrapper"]'
      );

      if (el) {
        el[0].classList.remove('ag-checked');
      }
    }
  },

这是 plunkr：https://plnkr.co/edit/3kxq4itW7F8tKZCu