use-viewport-size

use-viewport-size

뷰포트의 너비와 높이를 반환하고 변경을 구독하는 훅이에요. resize와 orientationchange 이벤트를 구독해요.

출처: 문서

본문

사용법 (Usage)

use-viewport-size 훅은 현재 뷰포트의 width와 height를 반환해요. resize와 orientationchange 이벤트를 구독해요. SSR 동안에는 { width: 0, height: 0 }을 반환해요:

import { useViewportSize } from '@mantine/hooks';

function Demo() {
  const { height, width } = useViewportSize();
  return <>Width: {width}, height: {height};
}

정의 (Definition)

function useViewportSize(): {
  height: number;
  width: number;
};

더 알아보기 (Learn more)