Как настроить DialogTitle в Material-UI

Question

Я изучаю реакцию и материал-интерфейс и пытаюсь обновить цвет шрифта в компоненте DialogTitle. Эта ссылка дала решение переопределить корневой класс диалога (код приведен ниже). Как переопределить корневой класс для DialogTitle, чтобы я мог изменить стиль заголовка?

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

Нашел решение .

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

Answer 1

Если вы хотите переопределить DialogTitle в своем файле theme.js или там, где находится ваша тема, вы можете сделать следующее:

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

Вы должны указать имя класса компонента. В разделе API каждого компонента пользовательского интерфейса материала здесь указывается имя :