我正在为折叠按钮和手风琴使用材质 UI。我希望人们能够单击“今天”按钮,然后打开第一个手风琴部分(上面写着星期六的部分)。今天按钮位于材质 UI 工具栏内。我也在为项目使用反应钩子。
我只是使用材料 UI 网站上显示的默认手风琴设置。每个手风琴都有自己的 ID(例如:panel1、panel2 等)。
我正在使用材料 ui 控制的手风琴中的示例布局
开放式手风琴示例:
封闭式手风琴示例:
你能给我的任何帮助都会很棒!谢谢。
但是,当开发人员工具中的移动分辨率时,我的菜单只会截断溢出文本。
热力学课被砍掉了。
我正在使用 Material ui 的选择菜单和 React。Material UI Select 文档我也在使用菜单项。我想让列出的类溢出到下一行。这是我每天展示课程的地方。
这是代码(这只是一个示例,它不会运行):
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<FormControl className={classes.formControl}>
<InputLabel id="demo-controlled-open-select-label" > Filter classes by day</InputLabel>
<Select
labelId="demo-controlled-open-select-label"
id="demo-controlled-open-select"
open={open}
onClose={handleClose}
onOpen={handleOpen}
defaultValue={subjectFilter}
onChange={handleChangeSubject}
className="styleSelect"
>
{item.SUBJECT === 'OPEN_LEARNING' &&
<ul className ="stylingList">
{(state.subjects) && state.subjects.filter(item =>
(item.SUBJECT === 'OPEN_LEARNING')).map(item =>
<li className ="stList">
{item.CLASS_FULL}
</li>
)}
</ul>
}
</MenuItem>
//this is just one day. I do this for all the days.
) )
}
</Select>
</FormControl> …Run Code Online (Sandbox Code Playgroud)