Question

我对material-ui库，特别是组件有问题。我在一个组件中有两个对话框，单击特定按钮后将打开。问题是其中一个可以正常打开，但是当单击第二个按钮（触发第二个对话框的打开）时，它将关闭所有组件，只有呈现给DOM的是一个空的div，如下所示：

您认为是什么原因造成的？

我尝试了所有发现的解决方案，还尝试了在组件布局中出现的每个位置替换Dialog代码。

这可能是material-ui的错误吗？

以下是Material-ui对话框组件的链接：https://material-ui.com/components/dialogs/#dialogs

    <Dialog open={state.open} onClose={handleClose}>
    <DialogTitle>Новая группа</DialogTitle>
    <DialogContent>
        <form>
            <FormControl>
                <input onChange={handleChange('age')} value={state.data.inputName} placeholder="Новая группа"></input>                                    
                <Button onClick={addNewAreaOne}>Добавить</Button>
                <Button onClick={handleClose}>Закрыть</Button>
            </FormControl>
            <br/>
        </form>
    </DialogContent>    
</Dialog>

    <Dialog open={state.open3} onClose={handleClose3}>
    <DialogTitle>Изменения</DialogTitle>
    <DialogContent>
        <form>
            <FormControl>
                <input onChange={handleChange3('newName')} value={state.newName} placeholder="Название группы"></input>                                    
                <Button onClick={updateAreaTwo}>Изменить</Button>
                <Button onClick={handleClose3}>Закрыть</Button>
            </FormControl>
            <br/>
        </form>
    </DialogContent>
</Dialog>

像这样改变状态：

    const handleClose3 = () => {
        setState({ ...state, open3: false });
    };

    const handleClickOpen3 = () => {
       globalActions.setAreaThreeShow(false);
       setState({ ...state, open3: true });  };

状态声明：

    const [state, setState] = useState({
        data: {
            myItems: [],
            open4: false
        },
        open: false,
        age: '',
        open3: false,
    });

为什么React material-ui模态无法正确打开？

0 个答案: