import { useState, useCallback } from 'react' const კომპონენტი = () => { const [რიცხვი, setრიცხვი] = useState(0); const handleClick = useCallback(() => { console.log(რიცხვი); }, []); return ( <div> <div onClick={() => setრიცხვი((prev) => prev + 1)}>რიცხვი: {რიცხვი}</div> <div onClick={handleClick}>ჩაწერა</div> </div> ); };

ამ მაგალითში, handleClick შექმნილია useCallback-ის გამოყენებით, ცარიელი დამოკიდებულების სია []-ით. ეს ნიშნავს, რომ ფუნქცია შექმნილი იქნება მხოლოდ კომპონენტის მონტაჟის დროს და არ განახლდება count-ის ცვლილებისას.

ამიტომ, როდესაც კლიკავთ "Log" ღილაკს, კონსოლში ყოველთვის გამოჩნდება count-ის მნიშვნელობა, რომელიც იყო პირველი რენდერის დროს (ამ შემთხვევაში 0), და არა აქტუალური მნიშვნელობა.

რომ ფუნქციამ ყოველთვის ჰქონდეს count-ის აქტუალური მნიშვნელობა, საჭიროა დაამატოთ count დამოკიდებულებების სიაში:

const handleClick = useCallback(() => {
  console.log(count);
}, [count]);

ან გამოიყენოთ სტატუსის განახლების ფუნქცია callback-თან ერთად, თუ გსურთ თავიდან აიცილოთ ფუნქციის ზედმეტი შექმნა.

ასე რომ, მნიშვნელოვანია სწორად მიუთითოთ დამოკიდებულებები useCallback-ში, რათა თავიდან აიცილოთ მოძველებული მნიშვნელობებზე დახურვა.