如何更改 Ag Grid React 中的上下文

Question

我正在尝试使用 documentation 为我的 React Ag Grid 应用程序添加上下文。我的问题是他们的代码示例没有使用我创建网格的方式。这就是他们添加上下文的方式

var gridOptions = {
    columnDefs: columnDefs,
    defaultColDef: {
        flex: 1,
        resizable: true
    },
    rowData: rowData,
    context: {
        reportingCurrency: 'EUR'
    },
};

// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', function() {
    var gridDiv = document.querySelector('#myGrid');
    new agGrid.Grid(gridDiv, gridOptions);
});

然后他们像这样更改上下文值

function currencyChanged() {
    var value = document.getElementById('currency').value;
    gridOptions.context = {reportingCurrency: value};
    gridOptions.api.refreshCells();
    gridOptions.api.refreshHeader();
}

虽然我使用的是 React，所以我正在像这样创建我的组件

const [gridParams, setGridParams] = useState(null);

const onFirstDataRendered = (params) => {
  setGridParams(params)
}

<AgGridReact
  columnDefs={columnDefs}
  defaultColDef={{
        flex: 1,
        resizable: true
  }}
  rowData={rowData}
  context={{ reportingCurrency: 'EUR' }}
  onFirstDataRendered={onFirstDataRendered}
>

这就是我在文件中更改上下文的方式

const currencyChange = (value) => {
     gridParams.context = { reportingCurrency: value };
     gridParams.api.refreshCells();
};

当我像这样更新上下文时，我的单元格看不到它们的上下文已更改。由于文档没有显示如何为 React 实现它，我想我只是遗漏了一些东西。有人知道那是什么吗？

Answer 1

貌似换上下文的方式其实不一样。摸索了一下，好像需要改成这样

const currencyChange = (value) => {
     gridParams.api.gridOptionsWrapper.gridOptions.context = { reportingCurrency: value };
     gridParams.api.refreshCells();
};

如何更改 Ag Grid React 中的上下文

How to change context in Ag Grid React

javascript

reactjs

ag-grid