如何在 AG-Grid 中禁用 SELECT OPTION答案

【问题标题】：How to disable a SELECT OPTION in AG-Grid如何在 AG-Grid 中禁用 SELECT OPTION
【发布时间】：2020-08-19 07:32:22
【问题描述】：

我正在尝试禁用 AG-Grid 和 React 中的下拉元素。就像 W3Schools 的这个例子：

option value="volvo" disabled>沃尔沃

这将是一个动态构建的下拉菜单，我找不到使用 cellEditor 或 cellEditorParams 执行此操作的功能。我找不到任何证据表明在 AG-Grid 中可以禁用下拉选项。

【问题讨论】：

你可以写一个自定义的cellEditor...
我查看了 cellEditors 的示例，并且很清楚如何更改 OPTION 标签内的数据。但是，我看不到如何实际更改标签/容器。我需要一个示例来演示如何更改包含标签。

标签： javascript reactjs ag-grid

【解决方案1】：

您可以通过为该字段使用自定义单元格渲染器来实现此目的，即

 {
     field: 'yourField',
     cellRenderer: 'selectboxRenderer',

    // Here **disable** is the prop that will get passed to your selectBoxRenderer
    // You can put your condition when based on which you want to disable
    // You will also have to receive that **prop** in your component
      cellRendererParams: {
          disable: ({ data }) => { 
              // Your condition here
          },
      }
 }

【讨论】：