useTimeout

useTimeout hooki, belgilangan kechikishdan so'ng biror callback funktsiyasini chaqirish imkonini beruvchi maxsus React hookidir.

useTimeout Hook

useTimeout hooki, belgilangan kechikishdan so'ng biror callback funktsiyasini chaqirish imkonini beruvchi maxsus React hookidir. Ushbu hook kechiktirilgan harakatlarni boshqarish uchun foydalidir, masalan, bildirishnomalarni ko'rsatish, animatsiyalarni ishga tushirish yoki debouncing xatti-harakatlarini amalga oshirish.

O'rnatish

npm install @udemere/usehooks

Foydalanish

import { useTimeout } from '@udemere/usehooks'
 
const MyComponent = () => {
	const showAlert = () => alert('Bu xabar 3 soniyadan so'ng ko\'rinadi!')
 
	// 3000 millisekund (3 soniya) uchun timeout o'rnating
	useTimeout(showAlert, 3000)
 
	return (
		<div>
			<p>Ogohlantirishni ko'rish uchun 3 soniya kuting.</p>
		</div>
	)
}

Parametrlar

| Nomi | Turi | Ta'rif | | ---------- | ------------ | -------------------------------------------- | ----------------------------------------------------------------------------- | | callback | () => void | Kechikishdan so'ng chaqiriladigan funktsiya. | | delay | number | null | Millisekundlarda kechikish. Timeout'ni tozalash uchun null dan foydalaning. |

Qaytadi

• Timeout'ni tozalovchi funktsiya. Ushbu funktsiya avtomatik ravishda komponent unmounted bo'lganda yoki kechikish o'zgarganda chaqiriladi.

Misol

const ExampleComponent = () => {
	const [message, setMessage] = useState<string>('Salom!')
 
	const updateMessage = () =>
		setMessage('Ushbu xabar 5 soniyadan so\'ng yangilanadi!')
 
	useTimeout(updateMessage, 5000) // 5000 millisekund (5 soniya) uchun timeout o'rnatilgan
 
	return (
		<div>
			<p>{message}</p>
		</div>
	)
}

Eslatmalar

• Agar delay null ga o'rnatilsa, timeout tozalanadi va callback'ning bajarilishi oldini oladi.
• useTimeout hooki, komponent qayta render qilinayotganda ham, callback'ning eng so'nggi versiyasini chaqirishni ta'minlaydi.