实施Google Material Design的React组件。 http://material-ui.com
单选组的行属性在 TextField.@mui/[email protected]
我想使用一个带有单选组的 TextField startAdornment，但是 row 属性不起作用，并且该组是垂直排列的。我想知道如何使其水平。 从 '
我正在使用 Material UI 模板之一来发布博客文章：https://github.com/mui-org/material-ui/tree/master/docs/src/pages/getting-started/templates/blog。 我使用 npx create-...创建了我的 React 应用程序
我正在处理材料，想要输入数字。使用他们在文档中提供的解决方案不起作用： 我正在处理材料并想要输入数字。使用他们在文档中提供的解决方案不起作用： <TextField inputProps={{ inputMode: 'numeric', pattern: '[0-9]*' }} /> 它看起来像是未来的一个功能。但我想知道使用 Material ui 解决数字输入并且仅接受数字作为输入的最佳方法是什么。目前我可以在文本字段中输入字母 在您的情况下，您可以将 inputMode:'numeric' 更改为 type:'number' 并删除模式属性。您可以尝试这样的代码片段： <TextField inputProps={{ type: 'number'}} /> 这仅接受数字作为输入。
材质 3 底部应用栏 - 居中的 FloatingActionButton 将图标移至左侧而不是右侧
我在 Material 2 中的应用程序以这种方式使用底部应用程序栏： 我在 Material 2 中的应用程序正在以这种方式使用底部应用程序栏： <com.google.android.material.bottomappbar.BottomAppBar android:id="@+id/bar" style="@style/Widget.MaterialComponents.BottomAppBar.Colored" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" app:backgroundTint="@color/primarycolor" app:fabAlignmentMode="center" app:navigationIcon="@drawable/ic_menu_time" app:navigationIconTint="@color/lighttextcolor2" app:theme="@style/ThemeOverlay.MaterialComponents.Dark" /> <com.google.android.material.floatingactionbutton.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" app:backgroundTint="@color/fab" app:layout_anchor="@id/bar" app:rippleColor="#FFFF8888" app:srcCompat="@drawable/ic_fab_search" app:tint="@color/darktextcolor" /> 不幸的是，当我通过做去学习材料 3 时 style="@style/Widget.Material3.BottomAppBar" 我得到了新的 m3 设计，这很棒，但我的图标现在移到了左边！！！ 我已经尝试过： 在我的menu.xml中，我添加了： android:layout_alignParentRight="true" 但没有效果 没有更多的想法... 非常感谢您的指导/帮助 在底部应用栏中添加此 app:menuAlignmentMode="auto"
Material-Ui TextField 不受 RTL 方向影响
我在我的 React 项目中使用 Material-Ui！ 我按照文档中的步骤在我的项目中允许 RTL，并且一切正常！ 除了 TextField 组件 轻轨方向： 左转方向 L...
我尝试将 Material UI 的网格项居中，但我无法实现这一点。文档说你可以使用 justifyItems 和alignItems 道具，但我无法通过使用这个来实现这一点......
我有一个通过道具接收一组颜色的对话框。根据这组颜色，我需要为我的 Material UI TextField 设置边框颜色，但我无法让它工作。 我有这个品牌...
MUI - 检查单元格在 `renderEditCell` 内是否可编辑
我有一个包含不同单元格类型的 MUI 数据网格。 我必须检查按用户权限编辑单元格的选项。我想在 renderEditCell 内执行此操作 - 仅在用户尝试编辑后，不想...
在 typescript 中扩展 Mui Typescript 断点
尝试使用自定义名称作为断点值时出现打字稿错误： 输入 '{ 手机：号码；平板电脑：数字； Desktop: number;}' 不可分配给类型 '{ xs: number; sm：号码；医学博士：
我想生成一个饼图，但即使我的数组包含要在饼图上显示的所有必要信息（通过控制台日志），我仍然会出现此错误。我也不知道
我目前正在开发一个项目，从 CoinMarketCap API 获取数据并显示在 MUI 数据表（更准确地说是 StickyHeader 数据表）中，但我一直遇到
React Router 路由不适用于 MUI Drawer 和 Redux Toolkit
将 Material UI 组件 Drawer 与 React Router 结合使用，使用 Redux Toolkit 管理全局状态。当我单击抽屉中的 NavLinks 时，它会更改不一致的路线。有时它有效，有时你......
由于我编辑Mui开关组件已经很长时间了，我想到了以下嵌套样式的排列，用于根据状态的变化设置新样式： ...
如何使用 React Hook Form 和 Material-UI 防止动态表单中的过度重新渲染？
我正在使用 React Hook Form 和 Material-UI 开发一个动态表单，其中内容根据前两个用户选择而变化。我的设置包括一个“生成器”页面，可呈现差异...
我在材质 UI 网格大小方面遇到了一些困难。我想在指定的断点处设置固定的网格大小。例如，xs 宽度为满，但 sm 宽度为 200px 我在材质 UI 网格大小方面遇到了一些困难。我想在指定的断点处设置固定的网格大小。例如，xs 宽度为满，但 sm 宽度为 200px <Grid item container direction="row" xs={12}> <Grid xs={12} sm={can be size 200px?}>Menu</Grid> <Grid item xs={12} sm>Content</Grid> </Grid> 我试图用风格来赋予尺寸，但它也会影响 sm{12}。我在堆栈中搜索但找不到正确的答案 您可以使用 theme 自定义断点。检查这是否有帮助。
我正在尝试实现以下响应式网格： https://i.sstatic.net/ARfMpH8J.png 对于桌面，我已经设置了所需的代码： 我正在尝试实现以下响应式网格： https://i.sstatic.net/ARfMpH8J.png 对于桌面，我已经设置了所需的代码： <Grid container spacing={2}> <Grid item sm={12} lg={6} order={{ sm: 2, lg: 1 }}> <Gallery images={product.images.map((image) => ({ src: image.url, altText: image.altText }))} /> </Grid> <Grid item sm={12} lg={6} container direction="column" order={{ sm: 1, lg: 2 }}> <Grid item> <ProductDescription product={product} /> </Grid> <Grid item order={{ sm: 3, lg: 2 }}> <Typography variant="titolo-1">$99.99</Typography> </Grid> </Grid> </Grid> 我的问题与项目的顺序有关。在移动设备上，不应应用嵌套网格项目容器，从而可以订购附加图像等项目。 是否可以在不隐藏和复制内容的情况下实现？ 这是更新的代码。尝试一下，我会等待您的反馈。 import { Grid, Typography } from '@mui/material'; <Grid container spacing={2}> <Grid item xs={12} lg={6} sx={{ order: { xs: 2, lg: 1 } }}> <Gallery images={product.images.map((image) => ({ src: image.url, altText: image.altText }))} /> </Grid> <Grid item xs={12} lg={6} sx={{ order: { xs: 1, lg: 2 } }}> <ProductDescription product={product} /> <Typography variant="titolo-1">$99.99</Typography> </Grid> </Grid>
Nextjs：类型错误：无法读取未定义的属性（读取“__emotion_styles”）
我执行新项目，Nextjs，我的问题是，在添加这两个文件后，我收到此错误，我不知道为什么： 类型错误：无法读取未定义的属性（读取“__emotion_styles”） 聊天下拉...
我有一张用户表。对于每个用户，我希望能够弹出一个对话框以便能够为用户编辑数据。目前的基本结构如下： { header: '编辑用户', 细胞：（
React - 您为选择组件提供了超出范围的值“undefined”
我正在创建一个材料-UI 对话表单，将数据发布到我的 API。我的后端数据库中的字段之一是二进制的，仅包含两个可能的选项。我如何在对话中反映这一点......
我按照此链接中的步骤通过更改主题来更改背景颜色material-ui --> Date Picker 对话框。更改主题改变了背景颜色，但没有改变颜色...