0

我在反应功能组件中使用 AgGrid 显示一些数据。对于作为对象的值，我试图显示它们的 json 值，我在 colDefs 中使用了 valueFormatter 选项，如下面的代码所示。但是当我使用这个时，我得到一个错误：

Error: ag-Grid: cannot get grid to draw rows when it is in the middle of drawing rows. Your code probably called a grid API method while the grid was in the render stage. To overcome this, put the API call into a timeout, eg instead of api.refreshView(), call setTimeout(function(){api.refreshView(),0}). To see what part of your code that caused the refresh check this stacktrace.

如果我不使用 valueFormatter 选项，则不会出现上述错误。我知道我需要根据错误在准备好网格时加载网格，但我不确定如何在反应功能组件中执行此操作。

代码示例：

import React, { useState } from "react";

import { AgGridReact, ICellRendererReactComp } from "ag-grid-react";
function Test(props) {
  const [rowData, setRowData] = useState(null);
  const defaultColDef = {
    sortable: true,
    filter: true,
    resizable: true,
  };
  const columnDefs = [
    {
      headerName: 'Sample Key',
      field: 'sampleKey',
      valueFormatter: (val) => JSON.stringify(val),
    },
    //OTHER COLDEFS
  ]
  
  return (
    <div className="container-fluid">
        <div className="card mt-2 p-3 bg-red shadow p-3 mb-5 bg-white rounded">
          <div
            className="ag-theme-balham"
            style={{ height: "500px", width: "100%" }}
          >
            <AgGridReact
              columnDefs={columnDefs}
              rowData={rowData}
            ></AgGridReact>
          </div>
        </div>
    </div>
  );
}

export { Test };
4

1 回答 1

0

你的问题是：JSON.stringify(val)

您正在尝试在圆形结构中使用 stringify 。

你可以看到 val 的输出

因此，如果您将其更改为val.value它对您有用。

你可以在这里看到一个例子

于 2020-06-29T14:54:32.193 回答