Sobes.tech
Middle

Γράψτε ένα προσαρμοσμένο React hook useScreenWidth(targetWidth), το οποίο επιστρέφει το τρέχον πλάτος οθόνης (screenWidth) και μια σημαία isMobile (true αν το τρέχον πλάτος είναι μικρότερο από το 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`.