反应材料-ui响应式布局

Question

我想在我的React应用程序中使用material-ui。这些组件非常棒，但似乎并不是为了响应而设计的。例如，我正在尝试在我的主页中实现Drawer组件，如下所示：

        <div>
            <AppBar
                title="My App"
                iconClassNameRight="muidocs-icon-navigation-expand-more"
                onLeftIconButtonTouchTap={this.handleToggle}
            />
            <TextField
                hintText="Hint goes here"
                floatingLabelText="Enter your Note here..."
                multiLine={true}
                fullWidth={true}
                rows={2}
            />
            <Drawer
                docked={false}
                open={this.state.open}
                onRequestChange={(open) => this.setState({open})}
            >
                <MenuItem>One</MenuItem >
                <MenuItem>Two</MenuItem >
            </Drawer>
        </div>
    );

当我在手机上加载它时，它不会像我希望的那样调整它的大小。有没有办法只使用材料ui使这个响应？如果没有，有什么办法可以使用Bootstrap或其他一些软件包来提供响应能力吗？

谢谢，-Jim

Answer 1

以下是您将找到所有需求的示例项目。 资源：

https://github.com/rafaelhz/react-material-admin-template

演示：

https://rafaelhz.github.io/react-material-admin-template/#/form?_k=09zo2h