Question

使用Material UI React，在单击按钮时，将打开一个对话框，在该对话框上单击“是”时，将在父对话框上方打开另一个对话框。打开子对话框之前如何关闭父对话框

Answer 1

将对话框简单地包装在包装器组件中，它们的open状态都指向相同的引用。

在此沙盒中查看一个有效的示例：https://codesandbox.io/s/delicate-star-cox1g

function Dialogs() {
  const [open, setOpen] = useState();

  return (
    <>
      <Button onClick={() => setOpen("first")}>Open first dialog</Button>

      <Dialog open={open && open === "first"}>
        <DialogTitle>First Dialog</DialogTitle>
        <DialogActions>
          <Button onClick={() => setOpen("second")}>Close First Dialog</Button>
        </DialogActions>
      </Dialog>

      <Dialog open={open && open === "second"}>
        <DialogTitle>Second Dialog</DialogTitle>
        <DialogActions>
          <Button onClick={() => setOpen(null)}>Close Second Dialog</Button>
        </DialogActions>
      </Dialog>
    </>
  );
}

子对话框打开后，如何使用Material UI React

1 个答案: