Как получить высоту элемента в react.js?

Пользователь

от ally , в категории: JavaScript , 6 месяцев назад

Как получить высоту элемента в react.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от leila.dickinson , 6 месяцев назад

@ally 

Вы можете использовать метод offsetHeight для получения высоты элемента в React.js:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
import React, { useEffect, useRef } from 'react';

const Example = () => {
  const elementRef = useRef(null);

  useEffect(() => {
    const elementHeight = elementRef.current.offsetHeight;
    console.log(elementHeight);
  }, []);

  return Пример элемента;
};

export default Example;


В этом примере мы используем хук useRef для создания ссылки на элемент и хук useEffect для получения высоты элемента через offsetHeight. Запись elementRef.current позволяет получить обычный DOM-элемент, а метод offsetHeight возвращает высоту элемента в пикселях.


Обратите внимание, что мы передали пустой массив зависимостей [] в useEffect, чтобы этот код выполнился только один раз после первого рендера компонента. Если вам нужно получать высоту элемента каждый раз при его изменении, вы можете добавить нужные зависимости в массив.