在 Material-UI 中使用自定义主题时已弃用版式警告

2024-03-16

在下面的代码中,我在 Material-UI 中使用了自定义主题:

import React from "react";
import ReactDOM from "react-dom";
import { MuiThemeProvider, createMuiTheme } from "@material-ui/core/styles";
import Button from "@material-ui/core/Button";
import { purple, green } from "@material-ui/core/colors";

const theme = createMuiTheme({
  palette: {
    primary: purple,
    secondary: green
  }
});

function App() {
  return (
    <MuiThemeProvider theme={theme}>
      <Button color="primary">Button1</Button>
      <Button color="secondary">Button2</Button>
    </MuiThemeProvider>
  );
}

ReactDOM.render(<App />, document.getElementById("root"));

我收到以下警告: Warning: Material-UI: you are using the deprecated typography variants that will be removed in the next major release.

我没有使用任何排版(更不用说任何已弃用的排版变体)

为什么我会收到此警告?有人可以解释一下吗?
完整演示请参见codesandbox:https://codesandbox.io/s/r5v9pjxnq4 https://codesandbox.io/s/r5v9pjxnq4

最小重现代码:https://codesandbox.io/s/p9628o7wlj https://codesandbox.io/s/p9628o7wlj
(结果只是使用createMuiTheme还给出警告!)


我只是添加我的index.html:

<script>window.__MUI_USE_NEXT_TYPOGRAPHY_VARIANTS__ = true</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Material-UI 中使用自定义主题时已弃用版式警告 的相关文章

  • 设置时区 React-Datepicker

    我正在使用反应日期选择器 https www npmjs com package react datepicker让用户选择一个日期 但是 现在它使用本地时间 PDT 但我想对其进行硬编码以使用特定时区 PST 我尝试使用utcOffset
  • 使用输入更新 redux 状态

    如何从文本输入更新 redux 状态 我正在尝试用文本输入做一个非常简单的 Hello World 当有人在文本输入中输入内容时 它应该更新我商店的 searchTerm 值 我无法弄清楚这些事情 1 如何获取输入的值并将其传递到其 onC
  • “ReactNode”不是有效的 JSX 元素

    我有以下代码 代码沙箱 https codesandbox io s react typescript forked 50beyp file src App tsx import ComponentType ReactNode from r
  • 反应模式 shouldCloseOnOverlayClick 不起作用

    我正在使用反应模式 点击叠加层后模式不会关闭 我为 isOpen 和 onRequestClose 提供了属性 但模式保持打开状态 closeModal gt this setState modalIsOpen false
  • 获取React组件的类型propTypes定义

    假设有以下代码 TestComponent propTypes text React PropTypes string myEnum React PropTypes oneOf News Photos 我在另一个文件中执行了以下操作 使用
  • React Map 总是使用最后一个元素的数据调用方法

    我正在制作一个社交媒体应用程序 我正在循环浏览所有评论并将其显示在用户界面上 当我单击编辑时 最后一条评论的文本总是显示在输入中 我尝试了很多不同的方法 改变了结构 使用bind来绑定上下文 但没有任何帮助 我正在使用 React Mate
  • Menu.Item 中的 Antd 自动换行

    可以在 Menu Item 组件中应用自动换行吗 示例不起作用
  • Nextjs 无法在生产环境中的“.next”目录中找到有效的构建

    我正在 docker 中运行我的应用程序 但我的生产构建和启动脚本仅在 docker 环境中失败 虽然node env开发在docker环境下运行良好 这是我的脚本 无法进行生产构建并启动服务器 我正在使用nodemon和babel bui
  • 使用 jestjs 时模拟 sessionStorage

    好的 我有一个简单的示例 React 组件 它与会话存储 https developer mozilla org en US docs Web API Window sessionStorage App jsx var React requ
  • Vue中有类似React.Fragment的东西吗?

    在 React 中我可以做这样的事情 parent component export default return div div 1 div div
  • 想要动态处理与分页相关的页码显示:ReactJS

    我有一些分页逻辑工作得很好 唯一的问题是我只能让它显示并固定数量的页面可供选择 现在我已经把它放到了 5 页 但我希望它能够根据总记录动态更改 假设我有 100 条记录 每页限制为 10 条 将有 10 页 现在我只能让它以这种方式显示 第
  • 在 React 应用程序的 shell 脚本中设置环境变量

    我正在尝试在 powershell 和 bash 脚本中设置一些环境变量 并在 ReactJS 应用程序中读取它们 shell脚本很简单 env AUTHDOMAIN some domain com env AUTHCLIENTID bun
  • React 中的 Reconciliation 详解

    我是 React JS 的新手 谁能准确解释和解是如何运作的 我尝试从 React 官方网站上理解它 但没有得到它 我是这样理解的 您会同意 React 使用组件使事情变得简单且更快 通过 JSX 我们可以让用户定义的组件变得更容易 一天结
  • 如何正确使用react-router-dom中的useHistory()?

    如何使用useHistory 正确吗 我无法从一个反应组件过渡到另一个反应组件 根据 React 文档以及 Stack Overflow 上的说明 我无法从 App js 转换到 MyComponent js 例如 我正在尝试 App js
  • webpack 4 React loadable 不会根据卡盘点分割供应商

    我目前正在使用 webpack 4 和 React loadable 来创建块 它实际上分块取决于断点 然而 供应商规模保持不变 React loadable 还不支持 webpack 4 吗 或者我缺少一些设置 css 实际上似乎被分成了
  • Next.js 中的 .env.local 文件未正确设置

    当我创建一个 env local文件在我的项目根目录中 它设置不正确 在文件中 我有我的 API 密钥 如下所示 API KEY SOME API KEY 然后当我尝试访问它时获取服务器端属性 with 进程 env API KEY 它不起
  • 以编程方式填写reactjs表单

    我正在编写一个用户脚本 但无法填写由reactjs制作的表单 我的代码 document querySelector id username value email protected cdn cgi l email protection
  • 如何在故事书中注入窗口变量?

    我想添加一个 React 组件 称为ApplicationForm to a 故事书 https github com storybooks storybook 故事书是这样写的 import configureStore from sto
  • 如何在react-bootstrap中禁用表单提交的

    在下面的代码片段中 我有许多文本类型的输入表单 如果用户点击 我似乎会得到相同的合成事件 就像他们按下提交按钮一样 我想忽略作为表单提交 只允许一个人按下 提交 按钮 我删除了一些表单组以减少示例 在所有情况下 按钮或 ENTER 键 e
  • 如何渲染变量(或 prop)内部的 jsx/html?

    const Footer gt let a b Hey b return div Some bold text a div 这只会呈现为Some bold text b Hey b 如何将粗体文本渲染为粗体 变量内容是我自己的 所以我不必担

随机推荐