在 ag-grid 单元格渲染中使用自定义组件

Question

我正在尝试在 ag-grid 的单元格中使用自定义组件，如果我使用标准 html 组件它可以工作，但如果我尝试使用自定义反应组件则不行

下面的代码不起作用

TABLE_COLUMNS = [
        {
            headerName: '', field: 'remarks', cellRendererFramework: (params) => {
                return <div>
                    <SpinningWheel height={100}/>
                </div>
            }
        }]

但下面的代码可以正常工作

TABLE_COLUMNS = [
        {
            headerName: '', field: 'remarks', cellRendererFramework: (params) => {
                return <div>
                    <button>push me</button>
                </div>
            }
        }

Answer 1

对我来说一切似乎都很好。我从他们的一个示例中创建了一个类似的组件，该组件包含在 plunker 的 div 中，并且它按预期工作。在 index.js 文件中的 columnDefs 中查找以下内容。

{
    headerName: "Child/Parent",
    field: "value",
    cellRendererFramework: (params) => <div><SpinningWheel {...params} name="Spinning Wheel"/></div>,
    colId: "params",
    width: 180
 }