React and Material-UI: MuiDialog- root застревает после закрытия диалога

Question

Я использую React с MaterialUI, и иногда, когда я закрываю диалоговое окно MUI, div застревает на экране с классом "MuiDialog- root":

<div class="MuiBackdrop-root" aria-hidden="true" style="opacity: 0; transition: opacity 195ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;">

Кажется, я не могу заставить его исчезнуть без обновления страницы, есть идеи?

Спасибо!

Answer 1

У меня была такая же проблема. Скорее всего, вы используете свойство TransitionComponent компонента Dialog. Вам необходимо переместить создание функции перехода за пределы компонента, в котором вы ее используете.

const DialogTransition = React.forwardRef((props, ref) => (<Slide ... />));

export default function MyDialog(...) {
    return (
        <Dialog TransitionComponent={DialogTransition} ...>
        ...
    );
}

source: github issue