在 React 中,並非總是需要直接呼叫子方法。但是,在某些情況下可能有必要,例如當子元件公開命令式方法時。本文示範如何使用 refs 來實現這一點,無論是基於類別的元件還是功能元件。
要使用refs 從基於父類別的元件呼叫子方法,請依照下列步驟操作:
const childRef = React.createRef();
<Child ref={childRef} />
childRef.current.getAlert();
隨著React Hooks 的引入,您現在也可以在功能元件中使用refs。以下是如何使用引用從父功能元件呼叫子方法:
const childRef = useRef();
const Child = forwardRef((props, ref) => { // ... });
useImperativeHandle(ref, () => ({ getAlert() { alert('clicked'); } }));
childRef.current.getAlert();
注意: 要注意的是,在React 中通常不鼓勵使用ref 來呼叫子方法。更好的做法是透過 props 和 state 向下傳遞資料並向上傳遞事件。
以上是React 中如何從父元件呼叫子方法?的詳細內容。更多資訊請關注PHP中文網其他相關文章!