Реагировать: не могу прочитать document.body.style.marginRight

Question

У меня проблемы с чтением свойства margin-right css для тела.Похоже, что при первоначальном рендеринге происходит сбой, но несколько раз он работал, когда я вручную настраивал margin-right.Я ожидаю, что это что-то делать, когда компонент рендеринга.Пробовал в использованииEffect и useLayoutEffect без успеха.

Соответствующий CSS:

body {
    margin-right: 10px;
}

Простое приложение create-реагировать:

function App() {
  const [marginRight, setmarginRight] = useState(
    document.body.style.marginRight
  );

  return (
    <div className="App">
      <p>BODY Right margin is: {marginRight}</p>
    </div>
  );
}

Answer 1

HTMLelement.style возвращает только встроенные стили.Чтобы получить доступ к стилю из вашего CSS-файла, вы должны использовать:

window.getComputedStyle(document.body).marginRight