1、useRef 绑定子组件
在父组件中通过调用 useRef() 获取到一个对象,然后将该对象通过 ref 属性绑定到子组件身上:
import { useRef } from 'react'
export default function Categories(){
const childRef = useRef();
return (
<CategoriesAdd ref={childRef}></CategoriesAdd>
)}
2、forwardRef 处理子组件
import { forwardRef } from 'react'
function CategoriesAdd() {
}
export default forwardRef(CategoriesAdd);
3、useImperativeHandle 返回数据或方法给父组件
import { useImperativeHandle } from 'react'
function CategoriesAdd(props, ref) {
useImperativeHandle(ref, () => {
return { 自定义属性名: 想要传递给父组件的数据或方法 } })
}
export default forwardRef(CategoriesAdd);
4、父组件获取子组件的数据或方法
console.log(childRef.current.自定义属性名)