You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
25 lines
598 B
TypeScript
25 lines
598 B
TypeScript
import { useState, useEffect } from "react"
|
|
|
|
export default function useMediaQuery(mediaQuery: string): boolean {
|
|
const [isMatch, setIsMatch] = useState(
|
|
typeof window !== 'undefined' ? window.matchMedia(mediaQuery).matches : false
|
|
);
|
|
|
|
useEffect(() => {
|
|
const onChange = (event: MediaQueryListEvent) => {
|
|
setIsMatch(event.matches);
|
|
};
|
|
|
|
window
|
|
.matchMedia(mediaQuery)
|
|
.addEventListener("change", onChange);
|
|
|
|
return () => {
|
|
window
|
|
.matchMedia(mediaQuery)
|
|
.removeEventListener("change", onChange);
|
|
};
|
|
}, []);
|
|
|
|
return isMatch;
|
|
} |