在React中要實現父組件對子組件的方法調用,離不開對React.forwardRef與useImperativeHandle的理解。
如果想直達使用方法,直接看第二點就可以了。如果想要理解透徹,請從開頭看起。
1、React.forwardRef: 實現ref
屬性轉發
React.forwardRef會創建一個React組件,能將其自身的 ref
屬性轉發給其後代組件。
這種技術並不常見,但在以下兩種場景中特別有用:
- 轉發 refs 到 DOM 組件
- 在高階組件中轉發 refs
React.forwardRef 接受一個渲染函數(可理解為一個組件)作為參數。這個函數的參數是props和ref,返回 React 節點。
```c
const FancyButton = React.forwardRef((props, ref) => (
));
// 以下這個 ref 直接指向
```
本文主要參考React中文網,根據自己的理解加以總結。
如有幫助到您,請三連支持一下,歡迎留言。
如有不同意見,可在評論區指出,謝謝~