Sobes.tech
Middle

Uzrakstiet pielāgotu React hook useScreenWidth(targetWidth), kas atgriež aktuālo ekrāna platumu (screenWidth) un zīmi isMobile (true, ja aktuālais platums ir mazāks par targetWidth). Hooks jāatjaunina, mainoties loga izmēram.

sobes.tech AI

Atbilde no AI

jsx import { useState, useEffect } from 'react';

function useScreenWidth(targetWidth) { const [screenWidth, setScreenWidth] = useState(window.innerWidth);

useEffect(() => { function handleResize() { setScreenWidth(window.innerWidth); }

window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);

}, []);

const isMobile = screenWidth < targetWidth;

return { screenWidth, isMobile }; }

export default useScreenWidth;


Этот хук отслеживает ширину окна браузера и обновляет состояние при изменении размера. Флаг `isMobile` устанавливается в `true`, если текущая ширина меньше `targetWidth`.