如何使用React ref实现长尾词的动态获取与更新？

本文共计1697个文字，预计阅读时间需要7分钟。

学习了React一段时间，99%的时间都在写state、prop、useState、useEffect等。对ref+特殊用法不太熟悉，前几天做一个需求，想用ref实现父子组件的状态传递，结果失败了。下面整理一下ref的相关内容。

写了一段时间的 react，99%都在写 state、prop、useState、useEffect，对 ref 特别不熟悉，前几天做一个需求，想用 ref 实现父组件捞子组件的某个状态值，结果失败了，特此整理一下 ref 相关内容。

什么是 ref

官网介绍：

在典型的 React 数据流中，props 是父组件与子组件交互的唯一方式。要修改一个子组件，你需要使用新的 props 来重新渲染它。但是，在某些情况下，你需要在典型数据流之外强制修改子组件。被修改的子组件可能是一个 React 组件的实例，也可能是一个 DOM 元素。对于这两种情况，React 都提供了解决办法，即使用 ref 来获取 dom 或组件实例。