React JS - 如何在Dialog的PaperProps中添加样式(material-ui)

2024-01-04

我正在使用material-ui ReactJs 中的Dialog 组件。

<Dialog fullScreen open={this.state.open}
  PaperProps={{ classes: {root: classes.dialogPaper} }}
  onClose={this.handleClose.bind(this)} transition={this.props.transition}>
  {this.props.children}
</Dialog>

在上面的代码中,我已经重写了 PaperProps 的根类。现在我还想覆盖 PaperProps 中的样式。是否可以在 PaperProps 中覆盖样式。

就像是PaperProps={{ classes: {root: classes.dialogPaper}, style:{} }}

如果我错了,请告诉我。我也想覆盖风格。


我得到了我的答案

<Dialog
{...otherProps}
  PaperProps={{
    style: {
      backgroundColor: 'transparent',
      boxShadow: 'none',
    },
  }}
>
  {/* ... your content ... */}
</Dialog>

这就是我们如何将样式放入对话框组件的 PaperProps 中。

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

React JS - 如何在Dialog的PaperProps中添加样式(material-ui) 的相关文章

  • onMouseEnter 和 onMouseLeave 未按预期运行

    我正在尝试为我的组件模拟悬停效果 然而 onMouseEnter Leave 事件没有按预期工作 现在我试图让它简单地 console log 一个字符串来检查它是否正常工作 但什么也没有发生 目的是我可以在悬停时更改其背景颜色 我尝试通过
  • create-react-app 抛出错误:“package.json 中缺少依赖项”

    所以我尝试运行reactjs官方教程并使用第一行代码 npx create react app react tutorial 我收到以下错误 npx installed 91 in 12 692s Creating a new React
  • 避免对象突变

    我正在使用 React 和 ES6 所以我遇到了以下情况 我有一个带有对象数组的状态假设a id 1 value 1 id 2 value 2 处于以下状态Object A 然后我将列表传递给Object B通过道具 Object B 在构
  • 如何在React中处理多个路由器

    假设我们有一个网络应用程序 它通常有很多视图 例如索引页面 管理面板 帮助页面 联系人等 我在主index js 中使用react router dom 来处理它们 它工作得很好 但是现在我在开发管理面板时遇到了问题 它是 index js
  • 覆盖Java中的属性[重复]

    这个问题在这里已经有答案了 在 Java 中 我最近有几个项目 我使用了这样的设计模式 public abstract class A public abstract int getProperty public class B exten
  • 函数执行后重新调用react hook

    我是反应钩子的新手 我有一个钩子函数 它从 API 接收一系列数据并显示在列表中 function useJobs const jobs setJobs React useState const locations setLocations
  • Material UI 组件中的媒体查询

    我在 React js 项目中使用 Material UI 组件 出于某种原因 我需要对某些组件进行自定义 以使其根据屏幕宽度进行响应 我已经添加了media query并将其作为组件中的样式属性传递 但不起作用 知道吗 我正在使用这样的代
  • 监听 redux 动作

    我想创建一个可重用的 redux 表模块 它将存储和更新页码 显示的总页数等 我可以在所有页面之间共享这些模块 但是 我需要更新操作来触发刷新数据操作 该操作将根据页面到达不同的端点 因此 可能类似于页面特定的监听 RefreshData
  • 如何在React Material UI简单输入中启用文件上传?

    我正在创建一个简单的表单来使用带有 redux 表单和材料 ui 的 electro react boilerplate 来上传文件 问题是我不知道如何创建输入文件字段 因为材料用户界面不支持上传文件输入 关于如何实现这一目标有什么想法吗
  • 创建 html 结构,每个 li 中仅允许 3 个 div 元素。在 React + underscore.js 中

    这是以下内容的位副本如何创建每个 li 中仅允许 3 个 div 元素的 html 结构 在 React underscore js 中 https stackoverflow com questions 38008023 how to c
  • 运行故事书时出错 - sh: 1: start-storybook: 未找到

    我运行时遇到错误故事书 即使是干净的安装 npm run storybook gt storybook media programmersedge New Volume devs demostorybook gt start storybo
  • useEffect 中的 setTimeout 函数输出缓存的状态值

    这很简单 我正在使用 Redux 来管理我的状态 我有一个setTimeout函数在一个useEffect功能 The setTimeout超时值为50000ms 我想要 SetTimeout 处理程序做什么 After 50000ms t
  • 由于 CORS 错误,POST 请求在 React axios 中被阻止[重复]

    这个问题在这里已经有答案了 我正在尝试向包含多部分数据的 API 发送 POST 请求 我在 postman 中测试了 API 一切正常 但是当我在react中调用API时 它给了我CORS错误 我交叉检查了 URL 标头和数据 对我来说一
  • React this.state 未定义?

    我正在遵循 Pluralsight 的初学者教程 在表单提交时将值传递给addUser组件方法 我需要将 userName 推送到this state users但我收到错误 App jsx 14 Uncaught TypeError Ca
  • 对话框不会关闭 primefaces

    我的其中一个页面上有一个对话框 打开很好 如果您使用页面上的按钮 它会关闭 效果很好 但是 如果您尝试 x 退出对话框 它将不会关闭 我相信这与我在对话框上有一个输入字段有关 但我不确定 如果这是一个骗局 我深表歉意 我找不到类似的帖子
  • 在社交媒体上分享 Reactjs 链接时,react-helmet 中的元标记不显示

    我有一个在客户端运行reactjs的项目 在后端运行nodejs express 我实现了react helmet来更新索引之外的路线的标题和元标记 例如 用户查看帖子 viewpost q POSTID 然后客户做了一个GET reque
  • 如何将 hls.js 与 React 结合使用

    我需要一些帮助来尝试弄清楚如何在 React 中使用 hls js 让我解释一下我必须从 api 获取 m3u8 的情况我能够使用基本的 html 使其工作
  • 有没有办法在 Next.js 的 getStaticProps 中使用 redux 工具包?

    我使用时获取数据useEffect代替getStaticProps 但在getStaticProps它表明钩子只能在功能组件中使用 import Head from next head import Image from next imag
  • s3 中托管的静态网站:页面刷新后返回 404

    使用此存储桶策略 Version 2012 10 17 Statement Sid PublicReadGetObject Effect Allow Principal Action s3 GetObject Resource arn aw
  • 子类构造函数(JAVA)中的重写函数[重复]

    这个问题在这里已经有答案了 为什么在派生类构造函数中调用超类构造函数时 id 0 当创建子对象时 什么时候在堆中为该对象分配内存 在基类构造函数运行之后还是之前 class Parent int id 10 Parent meth void

随机推荐