AG Grid React开启ReactUI后自定义loadingRenderer加载图标不消失问题咨询

开启reactUi参数后自定义加载器不消失，是AG Grid ReactUI模式的已知兼容问题，对应官方仓库相关issue目前仍在跟进状态。该模式下框架采用全React渲染链路，不再兼容旧版自定义渲染器返回HTML字符串的写法，且旧写法对应的加载状态更新逻辑存在适配缺陷，导致渲染完成后状态没有被正常重置。

目前有两种可行的适配方案：

• 方案一：调整自定义加载渲染器写法，返回合法React元素而非HTML字符串
  配置示例如下：

// 定义加载渲染组件
const LoadingRenderer = (params) => {
  if (params.value !== undefined) {
    return params.value
  }
  return <img src="https://www.ag-grid.com/example-assets/loading.gif" alt="加载中" />
}

// AgGridReact组件中绑定配置
<AgGridReact
  reactUi={true}
  components={{
    loadingRenderer: LoadingRenderer
  }}
  // 其他表格配置...
/>

• 方案二：采用内置加载Overlay替代自定义loadingRenderer
  ReactUI模式下对内置overlay组件的适配更完善，可直接配置使用，无需自定义渲染器：

<AgGridReact
  reactUi={true}
  loadingOverlayComponent="agLoadingOverlay"
  // 若需自定义加载样式，也可传入自定义React组件作为加载overlay
  // loadingOverlayComponent: CustomLoadingOverlay
  // 其他表格配置...
/>

如果暂时不想调整原有代码，可先关闭reactUi参数，待官方issue修复后再开启该配置。

内容的提问来源于stack exchange，提问作者Adam Youngers