Почему `ref.current.clientHeight` всегда 19 - PullRequest
Новая
       51

Почему `ref.current.clientHeight` всегда 19

0 голосов
/ 14 апреля 2020

Если я установлю высоту <div className="scale" ref={ref}> с CSS на 400 пикселей, я ожидаю, что ref.current.clientHeight будет 400 пикселей, но это всегда 19.

Как мне получить высоту div?

Мой план состоит в том, чтобы установить его на 100% и при этом знать высоту div. 

.scale {
   height: 400px;
   display: block;
}

import React, { useState, useLayoutEffect, useRef } from "react";

function Scale() {
  const [height, setHeight] = useState(0);
  const ref = useRef<HTMLDivElement>(null);

  useLayoutEffect(() => {
    if (ref.current && ref.current.clientHeight) {
      setHeight(ref.current.clientHeight);
    }
  });
  return (
    <div className="scale" ref={ref}>
      {height}
    </div>
  );
}

export { Scale };

Причина, по которой это всегда было 19, заключалась в том, что все родительские div, body и Html должны были иметь высоту 100vh

...