vue $refs 原理

vue $refs 是一个用来获取组件或元素的引用的属性，它可以在 Vue 实例或组件中使用。通过给元素或组件设置 ref 属性，可以给这个元素或组件取一个唯一的标识，$refs 属性可以根据这个标识来获取到对应的元素或组件。

$refs 的原理是在 Vue 实例初始化的时候，会遍历组件的 DOM 结构，在每个节点上记录下它的 ref 属性和对应的元素或组件的实例，然后存储在 Vue 实例的 $refs 对象中。当调用 $refs 属性时，实际上是从 $refs 对象中获取对应的元素或组件实例。

需要注意的是，$refs 只在组件渲染完成后才会被创建，所以在组件的 mounted 生命周期钩子中才能访问 $refs 属性。

使用 $refs 的时候，也需要注意保持引用的实时性，因为 $refs 只会在组件渲染完成之后才会更新，如果组件中的元素或组件发生了变化，$refs 中的引用可能会失效，需要在组件中手动更新 $refs。

总之，$refs 是 Vue 框架提供的一种获取组件或元素引用的便捷方式，使用起来简单方便，但也需要注意一些细节，保证引用的正确性。