如何使用MUI主题设置非MUI组件的样式？

文章/答案/技术大牛

发布

1回答

将MUI5主题添加到具有自定义情感主题的应用程序中

javascript、reactjs、material-ui、emotion

我正在使用一个具有多个主题的应用程序。它有一个MUI v4使用的重要UI主题。它还有一个非MUI组件使用的情感主题。据我所知，这会导致一些MUI组件从上下文中接收

浏览 11提问于2022-05-06得票数 1

0回答

reactjs、material-design、material-ui

例如，如果我需要动态地将MUI主题应用于非MUI组件，如<h1>。如果我希望<h1>标签始终是相同的颜色(来自主题颜色)并始终使用相同的页边距，我如何在主题中全局定义它，而不仅仅是按组件生成它。<h1>只是一个例子，但我关心的是我可能在应用程序中使用的任何第三方组件。

浏览 6提问于2018-07-17得票数 0

1回答

MUI v5主题与情感/mui

javascript、reactjs、typescript、material-ui

我已经把MUI从v4升级到了v5。然而，我现在很难理解主题如何与可用的不同主题解决方案一起工作。我真的不知道在哪里使用MUI主题/样式组件，以及何时使用情感组件。在新的组件中，我使用sx属性来应用样式，但是我有相当多的组件仍然使用createSty

浏览 15提问于2021-10-19得票数 2

回答已采纳

1回答

梅v5 @梅/材料/风格vs @情感/反应

reactjs、material-ui

这是一个后续问题，关于MUI v5主题的问题.虽然我的问题得到了回答，但我仍然很难理解@emotion/react的确切位置以及应该在什么时候使用@mui/material/styles。我读给，虽然这确实回答了一些‘如何’的问题，但我不明白更大的情况。我什么时候使用MUI的造型，什么时候情感的？为什么有两个造型解决方案？我应该<e

浏览 3提问于2021-10-19得票数 12

回答已采纳

1回答

在MUI中设计非MUI元素的最佳方式？

css、reactjs、material-ui

和两个当前用于样式MUI元素的API：当涉及到定制MUI组件时，很明显，最好使用这两种组件之一；而且似乎使用MUI并不限制所有非MUI方式的使用。这反过来又提出了在文档中显然未得到回答的问题：：MUI的样式化API和“样式化的<

浏览 8提问于2022-04-04得票数 1

回答已采纳

1回答

如何推断材料UI组件的反应styleOverrides？

reactjs、material-ui

我正在尝试自定义MUI5 TextField组件的颜色。简单地覆盖原色和第二颜色是不够的，所以我正在努力对颜色进行更多的控制。='outlined' value={token}/> 这是我使用的主题这就是应用在它上的样式

浏览 11提问于2022-11-06得票数 1

1回答

什么时候使用道具和CSS来设计素材UI元素？

css、reactjs、material-ui

何时应该使用道具(在.jsx脚本本身中)和CSS (单独的CSS样式表)来样式MUI元素？我是否仍然需要对MUI元素使用CSS样式表，例如使用CSS或sx={{}}支柱？还是应该只留给非MUI元素？虽然我理解MUI为我们提供了使用道具进行样式更改的模板，但我也理解我们通常应该遵循关注点的分离，这就是问题所在。

浏览 10提问于2022-10-26得票数 0

1回答

如何在不使用物质UI元素的React组件中使用Material样式系统？

reactjs、material-ui

Material (MUI)文档在这里被完全破坏了:在，最后一行是： “有关如何在非MUI组件中使用MUI系统的详细信息，请参阅->Advanced。”然而，到今天为止，到Advanced的链接已经死了(404)。有没有一种方法可以在MUIs组件之外使用样式系统？

浏览 3提问于2022-08-10得票数 1

回答已采纳

1回答

梅花材料断点错误主题不确定

javascript、reactjs、material-ui、frontend

Hi im试图放置我的代码断点，但在输出中显示错误 const useStyle = makeStyles

浏览 1提问于2022-06-23得票数 0

1回答

如何自定义物料界面中的滚动条？

javascript、css、reactjs、material-ui、scrollbar

我正在使用Material来扩展我的React项目，但是我不能更改mui组件中的滚动条。mui之后，我意识到css被mui自己的样式所覆盖，而使用mui组件(如<Box/>或<Drawer/> )。我还使用了来自梅的<ThemeProvider/>，主题如下： e

浏览 25提问于2022-01-09得票数 2

1回答

Mui主题的反应

reactjs、material-ui、appbar、themeprovider

我尝试过MUI AppBar的主题化，但我对主题一无所知。我是否可以在不使用样式组件或其他样式api的情况下使用主题为AppBar样式？palette.jsconst theme = createTheme({

浏览 4提问于2021-09-27得票数 1

回答已采纳

2回答

如何禁用/删除MUI* v5 BottomNavigation选定的css样式*

reactjs、material-ui、mui5

我试图为移动视图创建一个底部导航，当点击/按下图标时，我想禁用/删除所选的css样式。请帮帮忙。我的代码在下面。import { useState } from 'react';import BottomNavigation from &#

浏览 19提问于2022-10-27得票数 0

3回答

makeStyles for Material UI v.5的替代方案是什么

javascript、reactjs、material-ui

我刚开始使用Material UI版本5。最初为了使用我的自定义主题样式，我会使用makestyles，但它似乎在v.5中不起作用。我的主题在它们自己的组件上，为了导入它们，我使用了{createTheme}而不是旧的{createMuiTheme}。我像往常一样将我的主题导入到父组件中，并将其设置为<T

浏览 14提问于2021-09-21得票数 13

1回答

React MUI5 -重写InputBase的全局主题更改所有其他文本字段样式

reactjs、material-ui、mui5

我试图覆盖全局主题中所有<InputBase />组件的样式。MuiInputBase: { root: { },

浏览 9提问于2022-10-13得票数 0

1回答

使用makestyle时，梅5无法读取未定义的属性(读取“up”)

javascript、reactjs、typescript、material-ui

我最近建立了一个反应应用程序与MUI-5，它的工作很好，但现在我面临一个奇怪的问题，我的应用程序不会启动，我看到了一堆梅错误。这些错误发生在我删除了yarn.lock文件并新添加了所有包之后。错误： { "na

浏览 5提问于2022-10-02得票数 0

1回答

响应ViteJs css模块优先级顺序

reactjs、webpack、material-ui、styled-components、vite

我的项目是使用ViteJs，我使用Material作为主题和组件的基础。但是，在某些组件中，为了代码的可读性(因为某些元素需要多个样式属性行)；我选择在创建module.scss文件的同时创建一个行为(tsx、jsx)和样式(scss)。我担心的是，我在这个.module.scss文件中放置的自定义样式的优先级低于MUI

浏览 9提问于2022-06-15得票数 0

回答已采纳

1回答

MUI ThemeProvider未在已编译的组件中插入主题

reactjs、material-ui

所以我有两个使用MUI的项目。其中一个只包含小的功能组件(一个库)，另一个通过yarn link导入组件的“库”，并通过"ThemeProvider“应用自定义主题。我使用storybook作为我的组件列表。为了查看所有内容都按预期工作，我使用了storybook的插件：'storybook-addon-material-ui‘。，我的

浏览 13提问于2020-01-20得票数 2

回答已采纳

3回答

如何使用MUI* 5创建共享组件库*

material-ui

我有一个自定义的MUI 5组件库NPM包，它导出一些用MUI 5构建的基本组件，导出主题文件，并将主题提供程序封装到可重用组件中，如下所示： </StyledEngineProvider>} export default CustomThemeProvider;

浏览 7提问于2022-01-13得票数 6

1回答

梅v5:我需要安装“情感/反应”还是“情感/样式”来使用sx道具？

reactjs、material-ui

我已经将我的项目从v4迁移到了v5，我只使用sx螺旋桨。我还没有安装@emotion/react，一切都很好。是否有任何理由安装@emotion/react和@emotion/styled？"@mui/icons-material": "^5.0.1","@mui/material":

浏览 2提问于2021-10-22得票数 5

回答已采纳

4回答

TypeError:无法读取未定义的属性(读取“向下”)

reactjs、material-ui

但是我有一个错误: TypeError:无法读取未定义(读'down')的属性import { Theme} from "@mui/system"; const useStyles = makeStyles((theme:

浏览 4提问于2021-09-18得票数 3

点击加载更多

将MUI5主题添加到具有自定义情感主题的应用程序中