2

我有以下使用 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 的错误。

4

0 回答 0