ref li tintqala għal komponent customizzat mhux awtomatikament tasal għal nodu DOM ġewwa tiegħu. forwardRef tippermetti komponent jirċievi ref u jagħmilha li titlaq għal element tat-tifel. useImperativeHandle tikkustomizza x' juri dik ref.
ref li tintqala għal komponent customizzat mhux awtomatikament tasal għal nodu DOM ġewwa tiegħu. forwardRef tippermetti komponent jirċievi ref u jagħmilha li titlaq għal element tat-tifel. useImperativeHandle tikkustomizza x' juri dik ref.
const TextInput = forwardRef(function TextInput(props, ref) {
return <input ref={ref} {...props} />; // parent's ref now points to the <input>
});
// parent can focus the inner input:
const ref = useRef(null);
<TextInput ref={ref} />;
// ref.current.focus();
Satez m'intix irid tagħti laway in-nodu DOM kollu — biss metodi speċifiċi:
const FancyInput = forwardRef(function FancyInput(props, ref) {
const inner = useRef(null);
useImperativeHandle(ref, () => ({
focus: () => inner.current.focus(),
clear: () => { inner.current.value = ""; },
}), []);
return <input ref={inner} {...props} />;
});
// parent: fancyRef.current.focus(); fancyRef.current.clear();
Aghti l-preferenza props/state għall-komunikazzjoni. Ġib l-refs biss għal bużonji imperative ġenwini: immaniġġ tal-focus, scrolling, għażla tat-test, playback tal-media, jew integrazzjoni tal-libreriji imperative. Nota: f' React 19, ref tista' tiġi mtaqgħa bħala prop normali, għalhekk forwardRef ħafna drabi mhux meħtieġa aktar.