子组件
import React, { forwardRef, useImperativeHandle } from 'react';
const ChildComponent = (props, ref) => {
useImperativeHandle(ref, () => ({
aaa,
}));
const aaa = () => {
console.log('打印aaaa');
};
return <input type="text" ref={ref} />;
};
export default forwardRef(ChildComponent);
父组件
import React, { useRef } from 'react';
import ChildComponent from './ChildComponent';
const RefCom = () => {
const childRef = useRef(null);
return (
<div>
<ChildComponent ref={childRef} />
<button onClick={() => console.log(childRef)}>打印子组件的引用</button>
</div>
);
};
export default RefCom;