如何从父反应钩子打开对话框材质ui答案

【问题标题】：how to open dialog Material ui from parent react hook如何从父反应钩子打开对话框材质ui
【发布时间】：2021-04-25 07:31:18
【问题描述】：

我有一个父组件，它有一个抽屉和一些图标按钮，当我点击图标按钮时，我想要先加载子组件的对话框，然后如果接受对话框关闭，其余的子组件加载
父组件

<Child sendId = {id} OpenDialog={true}/>

子组件

const handleClose = () => {
    OpenDialog = false
};
return 
    OpenDialog ? 
        <Dialog open={OpenDialog} onClose={handleClose} >
            some Content
        </Dialog>
    : <div>
        rest of child componet
        </div>

但它总是打开，如果我关闭 doalog 并单击父 <Child ... 对话框再次打开，我想打开

【问题讨论】：

标签： reactjs react-hooks

【解决方案1】：

你必须在父组件中控制对话框的状态

父母

const [openDialog, setOpenDialog] = useState(false);
<Child sendId = {id} openDialog={openDialog} setOpenDialog={setOpenDialog} />

孩子

const handleClose = () => {
    setOpenDialog(false)
};

return 
    OpenDialog ? 
        <Dialog open={openDialog} onClose={handleClose} >
            some Content
        </Dialog>
    : <div>
        rest of child componet
        </div>

【讨论】：