Как указать стили для body в React JS?

Question

[Eugenue Cesarevich]

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

body {
    background-color: #644499;
    display: table;
    width: 100%;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

И когда этот компонент перестаёт мне быть нужен, этот стиль всё равно остаётся. Как мне задать стиль для body только на период жизни компонента? Да, можно устанавливать и убирать стили в componentDidMount() и componentDidUnmount(), но нет способа почище? А то слишком много кода на мой взгляд (свойств-то много).

Comments

[Валерий]

А что вам мешает задать те же стили для самого компонента?
Если компонент вложенный(на него могут повлиять стили родителя и пр.) можете воспользоваться React Portal

[G F]

https://caniuse.com/user-select-none

Answer 1

[vıtalıyırtlach]

В index.css который импортируется в index.jsx