如何在material-ui中自定义DialogTitle

Question

我正在学习 react 和 material-ui 并尝试更新 DialogTitle 组件中字体的颜色。这个link 给出了一个覆盖对话框根类的解决方案（下面列出的代码）。如何覆盖 DialogTitle 的根类，以便更改标题的样式？

root: {
    backgroundColor: theme.palette.primary.main,
    '& h6': {
      color: 'red'
    }
  }

找到solution。

<DialogTitle
    disableTypography
    id="alert-dialog-title"
    style={{ backgroundColor: 'navy', color: 'white' }}
>
    <Typography variant="h6">{ErrorBoundary.title}</Typography>
</DialogTitle>

Answer 1

如果您想覆盖 theme.js 文件中的 DialogTitle，或者您的主题所在的任何位置，您可以执行以下操作：

MuiDialogTitle: {
  root: {
    color: 'blue'
  }
}

你必须提到组件类名。在每个材质 ui 组件的 API 部分，name is specified here: