虽然我是 React 新手，但我是一名经验丰富的后端程序员。我正在努力向我们的系统添加功能来跟踪视频缩略图的印象。事实证明，在我的公司，已经存在实现此目的的代码，但它与识别 DOM 元素和 CSS 选择器紧密耦合（例如，跟踪特定图像的印象）。
我很乐意集成我们已有的代码来实现我自己的目标，并且我正在处理 React 组件、函数和类。我已经做了大量的研究，看起来要将 React 组件识别为 DOM 元素，该组件需要一个“ref”。
我的问题是：假设一个人正在从头开始一个项目。在编写 React 代码时，在（几乎）每个组件上放置引用是否明智？我无法从我的研究中找到明确的答案......我能找到的最好答案是“是的，如果你在某个时候将这些组件作为 DOM 元素进行操作”。但是，如果您事先不知道是否需要访问 DOM 中的这些元素，那么从一开始就添加 ref 是不是更好？
我问这个问题是因为我担心如果我想集成此代码来跟踪依赖于 DOM 元素的展示次数，那么我可能需要重构一些现有代码以包含引用，但我不确定如果这是 React 术语中的反模式（例如，如果我要向代码库中的every组件添加引用......这是不可取的，还是在 React 范式中更常见？）。
React 开发者建议尽可能少地使用引用，因为改变它们不会自动重新渲染组件。
来自：https://react.dev/learn/referencing-values-with-refs#differences- Between-refs-and-state
也许您认为 ref 似乎没有状态那么“严格”——例如，您可以改变它们，而不必总是使用状态设置函数。但在大多数情况下，您需要使用状态。 Refs 是您并不经常需要的“逃生舱口”。
就像他们说的，refs 是一个逃生舱口，所以如果需要的话你可以使用 vanilla JS，但使用它们实际上与 React 范式相反。 （当我说普通 JS 时，我的意思是直接与 DOM 交互，而不是通过框架）
但是，将现有的 React 项目与现有的 vanilla JS 项目集成似乎是使用 refs 的有效用例。另一种方法是重构普通 JS 以使用 React 状态，这可能需要大量时间。