Question

我使用Material-UI的预发布，您可以使用网格布局并实现断点。我已经使用了隐藏的组件和网格，现在我想使用对话框的ResponsiveFullScreen组件。问题是我不知道如何使用它和官方页面只是给出一点解释。

我可以使用Hidden来改变两个不同的对话框，但我不想以这种方式复制我的代码。那么是否有人知道如何使用它？我只想让对话在xs断点处成为全屏。

我使用扩展的React.Component类构建我的对话框，并在render（）中返回一个带有我自己内容的Material-UI对话框。

Answer 1

最后，我知道如何使用withResponsiveFullScreen。您必须直接将它用于Dialog Material-UI类，然后使用返回的组件来创建对话框。

这里和示例：

var ResponsiveDialog = withResponsiveFullScreen()(Dialog);
class MyDialog extends React.Component {
    constructor(props){ super(props); };

    render(){
        return (
            <ResponsiveDialog>
                <DialogTitle></DialogTitle>
                <DialogContent></DialogContent>
            </ResponsiveDialog>
        );
    }
}

重要提示：请勿在渲染功能中使用withResponsiveFullScreen。

使用断点更改断点＃pas和object：

var ResponsiveDialog = withResponsiveFullScreen({breakpoint: 'xs'})(Dialog);

如何在Material-UI对话框中使用ResponsiveFullScreen

1 个答案: