↼ All Hooks

usePrevious

usePrevious hook - bu maxsus React hook bo'lib, u holat yoki prop ning oldingi qiymatini saqlash va olish imkonini beradi.

usePrevious Hook

usePrevious hook - bu maxsus React hook bo'lib, u holat yoki prop ning oldingi qiymatini saqlash va olish imkonini beradi. Ushbu hook, ayniqsa, animatsiyalar, shartli render qilish yoki boshqa yon ta'sirlar uchun joriy qiymatni oldingi qiymati bilan solishtirish kerak bo'lganda foydalidir.

O'rnatish

npm install @udemere/usehooks

Foydalanish

import { usePrevious } from '@udemere/usehooks'
 
const MyComponent = () => {
	const [count, setCount] = useState(0)
	const previousCount = usePrevious(count) // Count ning oldingi qiymatini olish
 
	return (
		<div>
			<p>Joriy hisob: {count}</p>
			<p>Oldingi hisob: {previousCount}</p>
			<button onClick={() => setCount(prev => prev + 1)}>O'stirish</button>
		</div>
	)
}

Parametrlar

NomiTuriTavsifi
valueTSaqlanishi kerak bo'lgan joriy qiymat va oldingi qiymatni qaytarish uchun.

Qaytadi

Misol

const ExampleComponent = () => {
	const [isToggled, setToggled] = useState(false)
	const previousToggle = usePrevious(isToggled) // Oldingi tugmachani saqlash
 
	return (
		<div>
			<p>Tugma {isToggled ? 'YOQILGAN' : 'O‘CHIRILGAN'}</p>
			<p>Oldingi tugma {previousToggle ? 'YOQILGAN' : 'O‘CHIRILGAN'}</p>
			<button onClick={() => setToggled(prev => !prev)}>O‘zgartirish</button>
		</div>
	)
}

Eslatmalar