Sobes.tech
Middle

მოიწერეთ პერსონალიზებული React hook useScreenWidth(targetWidth), რომელიც აბრუნებს მიმდინარე ეკრანის სიგანეს (screenWidth) და ფლაგს isMobile (სინამდვილეში, თუ მიმდინარე სიგანე ნაკლებია targetWidth-ზე). Hook უნდა განახლდეს ფანჯრის ზომის ცვლილებისას.

sobes.tech AI

პასუხი 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`.