我有以下使用 React 引导模式和 MUI 数据表组件的 Nextjs 页面:
const Start = () => {
const [show, setShow] = useState(false);
const handleClose = () => setShow(false);
const handleShow = () => setShow(true);
const options = {
onTableInit: rowData,
onRowClick: rowData => Testing(rowData),
}
return (
<Layout>
<Modal show={show} onHide={handleClose}>
<Modal.Header>
<Modal.Title>Modal heading</Modal.Title>
</Modal.Header>
<Modal.Body>
Modal content
</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={handleClose}>
Close
</Button>
</Modal.Footer>
</Modal>
<MUIDataTable
title={"Datatable with modal onRowClick"}
data={data}
columns={columns}
options={options}
responsive="scrollFullHeight"
/>
</Layout>
)
}
export default Start;
bootsrap 模式工作正常并打开 onRowClick,我还可以在单击某一行时将 rowData 控制台记录在函数中:
function Testing(rowData) {
console.log(rowData)
);
当单击某行时,我想相应地将此 rowData 传递给引导模式。
我知道我应该使用映射,因为它是一个 JSON 对象
{rowData.map(item => {
return <li key={item}>{item}</li>
}
)}
但是如何将其集成到我当前的系统中?我得到关于 rowData is not a function 的错误。