Reactjs 基于动态条件的ag网格单元样式

Reactjs 基于动态条件的ag网格单元样式,reactjs,ag-grid,ag-grid-react,Reactjs,Ag Grid,Ag Grid React,我正在寻找ag网格中基于可设置阈值的单元动态渲染,超过该阈值,单元将呈现绿色或红色 我尝试了以下方法: <AgGridReact onGridReady={onGridReady} pagination={true} columnDefs={[ { headerName: "SYMBOL", field: "symbol" }, { headerName: "PRICE", fi

我正在寻找ag网格中基于可设置阈值的单元动态渲染,超过该阈值,单元将呈现绿色或红色

我尝试了以下方法:

<AgGridReact
  onGridReady={onGridReady}
  pagination={true}
  columnDefs={[
    { headerName: "SYMBOL", field: "symbol" },
    {
      headerName: "PRICE",
      field: "price",
      volatile: true,
      cellStyle: function (params) {
        if (params.value < threshold) {
          return { backgroundColor: "red" };
        } else {
          return { backgroundColor: "green" };
        }
      }
    }
  ]}
/>

并获取阈值的输入(设置状态)。但是,即使状态发生更改,
列defs
中也不会发生任何更改

我正在使用
.applyTransactionAsync()
进行高频更新。因此,在使用
.setColumnDefs()
时,该表不显示任何数据

是否有任何方法可以根据动态数据上的动态条件而不是固定条件来进行此单元格样式设置?

您可以使用AgGrid更新动态值,然后用于在网格中传递。以下是如何在
cellStyle
回调中引用
context
对象

{
标题名称:“价格”,
字段:“价格”,
cellStyle:(参数)=>{
if(参数值<参数上下文阈值){
返回{backgroundColor:“lightCoral”};
}否则{
返回{backgroundColor:“深蓝”};
}
}
}
设置
上下文
很容易

您可以使用AgGrid更新动态值,然后使用动态值在网格中传递。以下是如何在
cellStyle
回调中引用
context
对象

{
标题名称:“价格”,
字段:“价格”,
cellStyle:(参数)=>{
if(参数值<参数上下文阈值){
返回{backgroundColor:“lightCoral”};
}否则{
返回{backgroundColor:“深蓝”};
}
}
}
设置
上下文
很容易