Para usar
Código simples com addEventListener para evento resizeunknown
javascript
2 years ago
860 B
8
Indexable
const MOBILE_WIDTH = 600
const WelcomeNewCentury = () => {
const [isMobile, setIsMobile] = useState(window.innerWidth <= MOBILE_WIDTH)
const prevWidth = useRef(window.innerWidth)
const handleResize = useCallback(() => {
console.log('Called on resize!')
const currWidth = window.innerWidth
if (currWidth <= MOBILE_WIDTH && prevWidth.current > MOBILE_WIDTH){
setIsMobile(true)
} else if (currWidth > MOBILE_WIDTH && prevWidth.current <= MOBILE_WIDTH) {
setIsMobile(false)
}
prevWidth.current = currWidth
}, [])
useEffect(() => {
window.addEventListener("resize", handleResize)
return () => window.removeEventListener("resize", handleResize)
}, [])
return (
<>
{ isMobile ? <section>Is mobile</section> : <section>Is Full size</section> }
</>
)
}
export default WelcomeNewCenturyEditor is loading...
Leave a Comment