前端项目实战叁佰肆拾捌react-admin和material ui-Grid布局样式
<Grid style={{ margin: 0, padding: 0, display: "flex" }} > <Grid style={{ width: "70px", margin: "12px 0 0 12px" }} > {typeList && typeList.map((item: any, index: any) => ( <Paper > <ListM component="div"> <ListItem button style={typeId == item.id ? { background: '#ccc', height: "30px" } : { height: "30px" }} onClick={() => handleSelectType(item.id)}> <ListItemText>{item.name}</ListItemText> </ListItem> </ListM> </Paper> ))} <Card> </Card> </Grid> <Grid style={{ flexGrow: "1", margin: "24px 0 0 24px" }} > <Paper> <List hasCreate={true} filter={typeId ? { style_id: id, mat_id: typeId } : { style_id: id }} exporter={false} hasEdit={true} resource="t_base_style_materiel"> <MaterialTabChange typeId={typeId} value={value}></MaterialTabChange> </List> </Paper> </Grid> </Grid>
运行结果
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南