Получение ref null внутри крюка useCallback

Question

Я пытаюсь установить значение ввода, используя ref, но я получаю ref null внутри useCallback Hook.

let inputRef = useRef();
const search = useCallback(
        (data) => {
            console.log(inputRef);
        },
        [inputRef],
    );

return <input type="text" ref={inputRef} />

, и он показывает null в консоли браузера, когда я вызываю эту функцию .

это просто пример, показывающий, чего я пытаюсь достичь.

Answer 1

Возможно, вам нужно сначала передать null в useRef(). Затем вы можете получить доступ с помощью inputRef.current.

Попробуйте сделать следующее:

let inputRef = useRef(null);

const search = useCallback((data) => {
   console.log(inputRef.current);
}, [inputRef]);

return <input type="text" ref={inputRef} />

Из документации useRef():

useRef возвращает изменяемый объект ref, свойство .current которого инициализируется переданным аргументом (initialValue). Возвращенный объект будет сохраняться в течение всего времени жизни компонента.

Надеюсь, это поможет!