使用Hooks的React函数组件是否拥有实例可绑定ref？

你不能在函数组件上使用ref属性，因为函数组件没有实例。

上述文档说明至今完全生效，使用Hooks编写的函数组件依然不存在类组件意义上的组件实例，直接给未做特殊处理的函数组件传ref依然会拿到null同时触发控制台警告，不存在“用了Hooks就有实例”的情况。

很多人误以为现在函数组件支持ref，本质是混淆了「组件天生支持ref绑定实例」和「开发者通过API手动实现ref透传暴露」两个完全不同的逻辑：

• 类组件的ref能力是React默认提供的：只要给类组件传ref，React会自动把整个组件的实例对象赋值给ref，你可以通过ref直接访问组件实例上的所有state、方法，属于无感知的全量暴露。
• 函数组件本身每次渲染都是一次独立的函数执行，渲染结束后不会留存一个挂载了所有内部状态、方法的持久化“实例对象”，原生状态下根本没有可供ref绑定的目标，这也是文档明确说明函数组件不能直接用ref的核心原因。
• Hooks生态里提供了forwardRef和useImperativeHandle两个API，让函数组件可以自定义支持ref的能力：forwardRef的作用只是让组件能够接收父组件传来的ref参数，不会自动生成实例；拿到ref后你可以选择直接把它绑定到组件内部的DOM节点、嵌套的支持ref的子组件上，也可以配合useImperativeHandle手动定义要向外暴露的有限方法、属性，父组件通过ref只能访问到你主动暴露的内容，碰不到组件内部的其他逻辑和状态。

举个最常见的场景：你写了个通用的表单函数组件，内部维护了所有表单项的状态、校验逻辑、重置逻辑，用forwardRef+useImperativeHandle只向外暴露validate、resetValues两个方法，父组件通过ref只能调用这两个方法，完全无法访问内部的表单项状态、其他工具方法，这和类组件ref默认拿到全量实例的逻辑有本质区别。

最后提一个实际开发里的注意点：第三方组件库里的函数组件能不能直接传ref，完全取决于组件作者有没有做forwardRef封装，不要默认所有Hooks写的组件都支持ref绑定。

内容的提问来源于stack exchange，提问作者GreenAsJade