Question

const columnsTaenzer = [{
    headerName: "Any name",
    field: "yesno",
    checkboxSelection: (params: any) => {
        return (state.booleanValue) ? true : false;
    }
}, ...

我想根据状态值显示此复选框。

第一次呈现“ booleanValue”时为false。但是，当我更改布尔值的状态时，checkboxSelection无法识别更改。

在ag-grid的功能checkboxSelection中，state.booleanValue始终为false。同样，当我将valueCache设置为false并使用force参数调用refreshCells（）时，函数checkboxSelection始终具有state.booleanValue false。

我如何告诉ag-grid状态值已更改？

<AgGridReact
    rowHeight={50}
    rowSelection={'multiple'}
    rowDeselection={true}
    columnDefs={columnsTaenzer}
    onSelectionChanged={onSelectionChanged}
    onFirstDataRendered={autoSizeAll}
    rowData={state.tabledata}
    onGridReady={onGridReady}>
</AgGridReact>

//解决方案（更新-不起作用）

也许不是正确的方法，但是可以。使用上下文： Ag-grid Context 这些参数与redrawRows（）结合使用。只有redrawRows（）会触发“ checkboxSelection”。如果只想触发valueGetter，请使用refreshCells（{force：true}）

现在的问题：

如果调用redrawRows，它将更新表（大），但是上下文将最晚更新。

这意味着它将使用旧的上下文更新每个单元格

Answer 1

以下是您需要的工作插件（通过状态更新来更新checkboxSelection）： https://embed.plnkr.co/plunk/e5sKiz13v93Gg1oV

您可以使用上下文来传递布尔值。我尝试做您要达到的目标，而且似乎正在奏效。 AgGrid正在获得上下文的最新价值。您的代码实现可能存在一些问题。有关工作代码，请参见上述plunkr。我是通过在-https://www.ag-grid.com/javascript-grid-selection/#example-multiple-row-selection

处扩展代码来创建的

您需要做的是，当您单击“切换复选框”时，您可以执行任一操作

          onClick={() => {
            this.setState(p => {
              this.gridOptions.context = !p.isCheckboxShown; //set opposite value as of state before state is updated
              this.gridApi.redrawRows();
              return { isCheckboxShown: !p.isCheckboxShown };
            });
          }}

或

         onClick={() => {
            this.setState(
              p => {
                return { isCheckboxShown: !p.isCheckboxShown };
              },
              () => {
                this.gridOptions.context = this.state.isCheckboxShown;  //set same value as of state after state is updated
                this.gridApi.redrawRows();
              }
            );
          }}

此外，您可能还需要设置suppressRowClickSelection={true}。如果为真，则单击行时将不会发生行选择。在只需要复选框选择时使用。

网格+反应：checkboxSelection不更新状态

1 个答案: