在 ag-grid react 中添加 react-router-dom 链接

Question

如何在 ag-grid 中替换 react-router-dom 的 with。它使页面重新加载，而不是伪装成单页应用程序。

我试过这个，但它不起作用

cellRenderer:  (params)=> {
  return <Link to={`/?info=${params.data.Id}`}>"+{params.value}+"</Link>, 

是否有可能我们可以使用 Link 而不是

cellRenderer:  function(params){
  return "<a href='/?info=" + params.data.Id+ "'>"+params.value+"</a>";},

使用 Link 时，它会抛出错误：

错误：ag-Grid：在绘制行的中间时无法获取网格以绘制行。您的代码可能在网格处于渲染阶段时调用了网格 API 方法。为了克服这个问题，将 API 调用置于超时状态，例如调用 setTimeout(function(){api.refreshView(),0}) 而不是 api.refreshView()。要查看导致刷新的代码部分，请检查此堆栈跟踪。

堆栈跟踪中的错误指向下面的代码，但使用元素它可以正常工作：

===> GetAPI(){ var url = xxxxxxxxxxx; axios.get(url).then(response => { if (response.status == 200) { this.setState({patients: response.data, loading: false }); } }) .catch(e => console .log('获取费用列表时出错：在 Listing/index.js > 错误：', e.message,'\n for user : ',this.props.auth.user.email)) }.

Answer 1

我偶然发现了这个解决方案，但如果您将其reactNext={true}作为道具添加到 AgGridReact，您的第一个解决方案将与 cellRendererFramework 一起使用。

      <AgGridReact
        reactNext={true}
        columnDefs={columnDefs}
        defaultColDef={defaultColDef}
        rowData={tableData}
      >
      </AgGridReact>

然后在你的 columnDefs 对象中添加这个属性，

cellRendererFramework: (params) => {
  return <Link to={`/?info=${params.data.Id}`}>"+{params.value}+"</Link>, 

显然在 Ag grid 文档中，他们说 reactNext 中包含的功能最终会合并到稳定的源代码中，但还没有。