为什么css-in-js系统需要ThemeProvider/useTheme

文章/答案/技术大牛

发布

1回答

styled-components、emotion、chakra、rebass、styled-system

通过将主题导入组件直接访问主题和通过ThemeProvider访问主题有什么区别？

浏览 21提问于2020-10-19得票数 0

3回答

如何在资料UI 5中使用useTheme？

reactjs、material-ui、styled-components

我在网上看到了useTheme，所以我检查了文档和 - @mui/styles/useTheme。然而，这是遗留文档，而@mui/styles并不存在于MUI 5中。下面是我尝试过的选项列表，以及它们不起作用的原因： @mui/material/styles/useTheme -返回默认的主题对象，不管发生什么。@mui/system/useTheme -这就是我希望能奏效的东西。然而，这也可能是最奇怪的。它给出了默认的主题，但它排除了许多

浏览 9提问于2021-10-19得票数 17

回答已采纳

1回答

MUI没有正确地将主题传递给MUI组件。

javascript、css、reactjs、material-ui、themes

import { LocalizationProvider } from "@mui/lab";import { ThemeProvider<LocalizationProvider dateAdapter={AdapterDateFns}> <ThemeProviderStyledEn

浏览 7提问于2021-10-02得票数 6

回答已采纳

3回答

材质用户界面:从主题中提取颜色

reactjs、material-ui

material-ui主题的颜色： <UsersIcon color={currentTheme.primary1Color} />因此，我需要从当前提供的主题中提取一个值

浏览 6提问于2017-04-02得票数 5

回答已采纳

2回答

为什么我在这里不能使用ThemeProvider (Material UI)？

css、reactjs、material-ui

我不知道为什么。/styling/mainTheme"; <Provider store={configureStore()}> </Provider> </ThemeProvider<

浏览 1提问于2019-10-20得票数 1

回答已采纳

1回答

响应钩子/不必要的组件呈现

reactjs

我的代码： const theme = useTheme(); const handleClick = () => { }; <ThemeProvider theme={theme}>setText(e.target.value)} placeholder=&quo

浏览 3提问于2020-02-17得票数 0

回答已采纳

1回答

React + Material防止子树在切换父主题时重装的最佳方法

reactjs、react-hooks、material-ui、components、react-router-dom

import { createContext, useState, useMemo } from 'react'; ColorModeContext, colo

浏览 6提问于2022-05-12得票数 2

回答已采纳

2回答

如何根据材质UI中的主题更改显示的按钮？

reactjs、material-ui、angular-material、material-design、material-ui-x

我正在显示一个SettingsIcon在光和暗模式之间切换。但是我想显示DarkModeIcon从光到暗，LightModeIcon从暗到光。const themeLight = createTheme({ background: { text: { }, mode:&#

浏览 7提问于2022-06-27得票数 0

1回答

如何获取光和暗变体的反应材料-UI原色和二次颜色？

reactjs、material-ui

材料-UI文档的反应说，光和黑暗变体的主要和次要颜色将自动计算。const theme = createMuiTheme({ primary: { main: '#ff4400',我似乎找不到的是如何访问这些颜色，以便在我的组件中使用。在实现了这样的主题之后： con

浏览 2提问于2020-04-02得票数 7

回答已采纳

1回答

响应jss覆盖父样式并保留子样式。

reactjs、jss

下面是在更改之前使用的一个示例：//styling createUseStyles as createStyles, ThemeProvider,

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

1回答

反应初学者-理解黑暗模式下的useContext

reactjs、react-hooks、react-context、darkmode

/App.css";import Switch from "./Styles.css"; import { useTheme } from "..为什么会这样呢？为什么像在App.js中看到的那样需要{ ThemeContext }以及返回ThemeContext返回语句？在App中

浏览 2提问于2022-11-16得票数 0

1回答

我们可以同时使用MUI makeStyles和_app.js中的主题吗？

javascript、reactjs、material-ui、next.js、theming

为了使内容因状态变化而收缩，我不得不将整个导航系统放在_app.js文件中，而不是将它放在一个单独的组件中。即使它很明显的工作，我不知道它是否不会影响渲染和性能，一旦建立。makeStyles((theme)似乎运行得很好，但在VScode中没有突出显示，这可能是因为我在同一个文件中同时使用了makeStyles、useTheme和ThemeProvider，如下所示：import { makeStyles, useTheme } from '@material-ui/core/styles

浏览 3提问于2021-03-04得票数 0

1回答

无法使用@emotion/styled访问样式化组件中的主题

reactjs、typescript、material-ui、styled-components、emotion

我使用@emotion/react主题化和注入主题到它，我能够访问主题使用useTheme到组件，但不能访问主题到样式使用@emotion/styled。有什么需要帮忙的吗？import styled from '@emotion/styled'; import { ThemeProvidertheme }) => theme.pr

浏览 83提问于2021-10-26得票数 3

2回答

如何将资料-ui的主题对象传递给defaultProps？

reactjs、material-ui、react-props

在React中，我有一个功能组件来验证道具并为任何非必需的道具实现默认的道具。我还使用mui的makeStyles获取theme对象，将样式应用于组件。import React from 'react';import { makeStyles } from '@material-ui/core/styles'; const useStyles = makeStyles(t

浏览 2提问于2020-04-14得票数 3

回答已采纳

1回答

如何使用reactjs为主题创建上下文？

javascript、reactjs、typescript、next.js

我需要创建一个上下文，以便在存储库中应用暗或轻主题。

浏览 3提问于2022-02-03得票数 0

1回答

如何在react js中检查材料ui主题的类型？(亮或暗)

reactjs、types、material-ui、themes

我想根据材质ui主题的类型是亮还是暗来创建特定的条件，我该怎么做呢？

浏览 7提问于2020-10-27得票数 3

1回答

使用样式组件实现不同的主题

javascript、styled-components

我看了很多关于样式组件的教程和例子，但是主题总是在app/top组件上存储和更改，而我最好需要它存储在配置组件中，并在另一个组件上呈现。我怎么能做到这一点而不一定要改变结构呢？

浏览 1提问于2022-09-02得票数 0

回答已采纳

1回答

“巢”主题是否有可能做出反应？

reactjs、react-context

theme={theme}> </ThemeProvider>}; return <ThemedApp/>;(我没有编写这段代码，所以我不知道为什么它将ThemedApp导出为FirebaseApp，而不是仅仅将ThemedApp重命名为然而，应用程序的一个部分(我们称之为'DifferentFon

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

回答已采纳

1回答

梅花抽屉:我该如何超越主题？

reactjs、react-hooks、material-ui

我想了解从useTheme()钩子返回的主题是从哪里访问的。/components/material-ui/AppBar';//apply theme/imgs/Symboltm_FirstKey_01.jpg'; import { styled, useTheme } from '@mui/

浏览 6提问于2021-12-30得票数 0

1回答

创建的包在导入时没有捕获正确的组件

reactjs、npm、packaging、amplify

React, { useEffect } from "react";import {Authenticator, Image, ThemeProvider, useTheme, View, Heading, defaultDarkModeOverride} from '@aws-amplify/ui-react';

浏览 5提问于2022-08-20得票数 1

点击加载更多