如何使用 ag-grid 禁用行？

Question

我使用 ag-grid 并且我发现了如何在文档中禁用列 (https://www.ag-grid.com/documentation-main/documentation.php) 但是在阅读文档之后，我从来没有找到如何使 juste one row 禁用。

我已经试过了editable: params => params.data.active === true. 也许我没有读对或者不存在。这里有人有解决方案吗？

Answer 1

TL;DR

库中没有禁用单行的选项（基于视觉和键盘事件），我们禁用单行的唯一方法是对 header 和随后的单元格复选框，这允许完全控制复选框。除此之外，还有其他三种方法可以根据值禁用ag-grid复选框，

1)这是使用 checkBoxSelection 参数，它会根据条件清空单元格。

checkboxSelection = function(params) {

   if (params.data.yourProperty) {
      return true;
   }
   return false;
}

这只会禁用点击事件并相应地设置样式，

cellStyle: params => return params.data.status? {'pointer-events': 'none', opacity: '0.4' } : '';

3)这将完全禁用它，因为您可以控制输入，但您可能必须使用字符串文字，

cellRenderer: (params) => {
       if (params.value) {
          return `<input type="checkbox" checked/>`;
       }
       else {
          return `<input type="checkbox" />`;
       }
 }

您可以使用 customCellRenderer(customCellRendererParams for props)、headerCellRenderer（headerCellRendererParams for props）它接受完整的 JSX 组件。

我认为这将是最有帮助的，它允许您根据该列的行值选择 cellRenderer 组件。它在 ag-grid documentation.

如何使用 ag-grid 禁用行？

how to make row disabled with ag-grid?

vue.js

ag-grid