将数据从父级传递到模态

Question

我的父窗口上有一个 ag-grid。单击单元格上的链接获取详细信息数据，然后启动模态窗口。然后，模态窗口会在该窗口的另一个 ag-grid 上显示详细信息。

我在这个模态窗口上还有一个按钮，点击它会获取并重新填充 ag-grid。这个功能对我来说很好用。

点击父节点时，数据会被获取，但不会绑定/显示在模式窗口的网格上。 不知道我在这里错过了什么。

到目前为止，我已经尝试了以下...

Parent:

function ParentWindow(props)
{
const[detailsData,setDetailsData] = React.useState();

function myCallBack()
{
   //Fetch data using REST API...   
   setDetailsData(data);
}

<MyDetailsData show={isOpen} detailsData={detailsData} title={}> </MyDetailsData>

}

Modal:
function MyDetailsData(props)
{
const[detailsData,setDetailsData] = React.useState(props.detailsData)<MyDetailsData


const getDetails = (params) =>
{
//Fetch data using REST API
...
...
const data = ....
setDetailsData(data)

}

const columnInfo= [
{
....
}
];

<Button value="Submit" onClick={getDetails}>

<Modal...>
....
<AgGridReact rowData={detailsData} columnDefs={columnInfo}..></AgGridReact>

</Modal>

}

Answer 1

感谢您的帮助！我能够通过以下方式解决此问题：

1. 在父窗口上使用 gridData 属性 例如

2. 在模态窗口中使用gridOptions.api.setRowData(myData)，在按钮点击事件函数中。

使用这两个选项，数据现在在模态窗口中的我的 ag-grid 上可见，无论是当用户从父窗口转到模态窗口时，还是当用户单击模态窗口本身上的提交按钮时。