admin管理员组

文章数量:1794759

warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you me

warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you me

报错：

​ ref=www.105188/sh/1092667.html style="color:#2aa0ea" target=_blank class=infotextkey>warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()? Check the render method of BaseFormItem.

问题状况：

原因分析：

​在Antd Form 组件中使用自定义 Function component时提示以上警告错误。父组件想拿到子组件的 ref，使用 antd 的 Form.create() 包装子组件之后，可以通过包装后的组件的 wrappedComponentRef 拿到子组件的实例。但是因为子组件是一个 function component 没有实例，导致不能在子组件上使用 wrappedComponentRef 属性(本质上使用了 ref 属性获得子组件的实例 _class，且 antd 对本来的 ref 属性另外包装了一下，返回的不是子组件的实例 _class)。 ​即：refs无法获取，这是antd form双向绑定对ref有需要。因为ref和key一样，不是通过prop来传递的，react对其有特殊的处理。

解决方案：

​ 在子组件上包裹一层forwardRef，forwardRef需从react中导出 ​ 官方案例：Refs转发

本文标签： componentsrefswarningfunctionref

版权声明：本文标题：warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you me 内容由林淑君副主任自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.xiehuijuan.com/baike/1686957769a122122.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。