个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
27
4
我正在开发一个个人网站，前面使用 NextJS 和 MAterial-UI，后面使用 Strapi。但是，当我编写代码并保存时，有时我在 const 'useStyles=makeStyles' 下编写的 CSS 不受欢迎。我不知道天气是 NextJS 还是 Material-UI 问题。
检查以下示例:
CSS 尊重:
不尊重 CSS(注意 justify-content 和搜索输入没有 CSS):
该代码可在此处获得。 https://github.com/augustomallmann/personal/blob/main/frontend/src/components/Header.jsx
我试图在页面上插入代码，但没有正确设置样式。
最佳答案
看来您刚刚开始使用 mui，我刚刚检查了您的源代码，发现您没有正确初始化 mui，请访问此链接以正确使用 Next.js @ 中的 material-ui
https://github.com/mui-org/material-ui
import React from 'react';
import PropTypes from 'prop-types';
import Head from 'next/head';
import { ThemeProvider } from '@material-ui/core/styles';
import CssBaseline from '@material-ui/core/CssBaseline';
import theme from '../src/theme';
export default function MyApp(props) {
const { Component, pageProps } = props;
React.useEffect(() => {
// Remove the server-side injected CSS.
const jssStyles = document.querySelector('#jss-server-side');
if (jssStyles) {
jssStyles.parentElement.removeChild(jssStyles);
}
}, []);
return (
<React.Fragment>
<Head>
<title>My page</title>
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
</Head>
<ThemeProvider theme={theme}>
{/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
<CssBaseline />
<Component {...pageProps} />
</ThemeProvider>
</React.Fragment>
);
MyApp.propTypes = {
Component: PropTypes.elementType.isRequired,
pageProps: PropTypes.object.isRequired,
};
关于reactjs - NextJs/Material-ui 不尊重 makeStyles CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/65279455/
27
4
0
我在 R Markdown 文档中设置全局选项时遇到问题。下面是一个简单的例子。在这种情况下，我试图设置 global.par = TRUE .期望是任何 par()我在一个夹头中制作的规范被带到后续
Cloudflare 正在缓存我的请求，但它忽略了语言 header 。 示例请求: URL : https://api.example.com/v1/places/?param=1¶m=2
我正在尝试创建一个分面条形图，每个分面的百分比加起来为 100。对此的解决方案似乎是 group 的组合和 ..density.. .如何 - 在我看来 group与 fill 冲突. 数据: tes
我正在开发一个 C# 应用程序，该应用程序试图遵守其运行系统的时间格式。如果 Windows 控制面板更改为 24 小时格式，这就是应用程序显示时间的格式。无论如何，它成功地做到了这一点，除了只有在应
我用过 Vundle安装 editorconfig-vim插件。它正确加载并列在 :scriptnames 中.但是当我创建一个新文件时，比如 x.js ，缩进设置不是从 ~/.editorconfi
我曾尝试使用不同的方法自行解决这个问题，但没有一个给我预期的结果。 当我在我的项目的数据库中保存一个文本类型的变量时，问题就出现了。它用换行符保存它，事实上，当我尝试从我的一个 View 中编辑它时，
让我头疼的代码是这样的: $('#timeline .selected').removeClass('selected'); 它在 IE8 中无法正常运行。这些类确实被正确删除，但不知何故该元素仍然具
在处理 java 中的 Swing 对象(还有 JFX，但我稍后会担心这个问题)时，我遇到了一个让我摸不着头脑的问题。 这是我用来在程序中打开字体的代码。这是相当标准的。 public static
我正在为电子商务购物车使用 SOAP API，但我似乎无法让 session 在不同的页面中持续存在。 作为示例，我在下面有一些测试代码(带有一堆调试消息)，它将一个项目添加到购物车，然后查看购物车。
我有一个 fieldset与 legend可能加载了很长的字符串。 我想要 legend尊重 fieldset 的宽度并且只使用了 50% 的空间。 目前，如果legend太长它仍然只占fieldse
我有一个完整城市的 3D 模型，想展示一个 这些建筑物的等距 View 。我为此使用 gnuplot 多边形， 因为我不认为我可以将 pm3d 用于具有坐标的多边形 不在一个明确定义的网格上。多边形以
我理解 Clojure 的 *assert*变量可用于关闭断言，但我所做的一切似乎都不起作用。 (defn foo [a] {:pre [(pos? a)]} (assert (even? a
我有一个带有 DependencyProperty 和 CoerceValueCallback 的控件。此属性绑定(bind)到模型对象上的属性。 当将控件属性设置为导致强制的值时，绑定(bind)会
可以通过将它们放置在 smcs.rsp 中来创建全局定义，当您点击播放时 - 您会注意到代码的这些部分被点击，并且一切都表现得好像它应该的那样。 但是，在 MonoDevelop 中编辑源代码时，它无
总的来说，我非常努力尊重模块的隐私(如果变量以下划线为前缀，我不会使用它)。然而，我有一个极端的情况，它看起来相当“安全”。 这是演示 ( my previous question ) parser=
我有一个悬停动画的 div(我正在使用 jquery 的 .hover() 方法)。 div 包含一个带有选择的表单。打开选择并悬停在选项上会使 IE9 将其解释为“取消悬停”父 div，导致第二个悬
如果 max_user_connections 连接已打开，是否有方法告诉 Entity Framework 等待？ 我想我可以捕获异常并重试或保留一个计数器，但这最多感觉很糟糕。 我的 Azure
在我的测试中，BitmapFactory.decodeFile() 创建的 Bitmap 不遵循 EXIF header 。 例如，当我调用 Bitmap.getWidth() 时，设备拍摄的肖像图像
请帮助我了解如何解决这个问题。 这是我的路由文件 (auth-routes.js) const userControllers = require('../controllers/user') mod
我的应用程序有时会注入(inject) 标记到网站中，然后创建一个新的 带有亲戚的标签 src 例如设置并注入(inject) 导致浏览器从 http://localhost:8080/chapter
我是一名优秀的程序员,十分优秀！