[react] Warning: Function components cannot be given refs. Attempts to access this ref will fail. Di

error[react] Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?question如果父组件包含子组件，useRef不能直接用在子组件上，控制台会报错Warning: Functio

周雪zzZ

5072人浏览 · 2021-10-11 09:19:49

周雪zzZ · 2021-10-11 09:19:49 发布

error

[react] Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

question

如果父组件包含子组件，useRef不能直接用在子组件上，控制台会报错
Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

solution

如果希望修改子组件html元素，则使用将函数组件通过用forwradRef包装。父组件中创建的ref转发进子组件
如果希望调用子组件方法，则使用useImperativeHandle，只暴露出父组件需要的方法

开放原子开发者工作坊

开放原子开发者工作坊旨在鼓励更多人参与开源活动，与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动，如meetup、训练营等，主打技术交流，干货满满，真诚地邀请各位开发者共同参与！

更多推荐

人工智能在库存管理中的应用

开放原子开发者工作坊

dubbo启动报错failed to bind nettyserver on

dubbo报错今天启动项目的时候，关掉了custom服务，<dubbo:consumer check="false"/>并且关掉了spring的elastic-job，但是还是报错，看了下错误代码，原因是因...