$refs 获取子组件和 HTML 元素：Vue.js 中使用 $refs 的详细指南

$refs 是 Vue 实例的一个属性，用来获取被指定了 ref 属性的子组件或 HTML 元素。通过 $refs 属性获取到的是一个对象，对象的属性名就是 ref 属性的值，属性值则是对应的子组件或 HTML 元素。

如果 ref 属性指向的是一个组件，那么 $refs 对应的属性值就是该组件的实例。如果 ref 属性指向的是一个 HTML 元素，那么 $refs 对应的属性值则是该元素的 DOM 对象。

$refs 可以在 Vue 实例的任何方法中使用，例如在 created、mounted 和 updated 方法中都可以使用 $refs。

示例：

<template>
  <div>
    <child ref='myChild'></child>
    <button @click='handleClick'>获取子组件</button>
  </div>
</template>

<script>
import Child from './Child.vue'

export default {
  components: {
    Child
  },
  methods: {
    handleClick() {
      const child = this.$refs.myChild
      console.log(child) // 输出子组件的实例
    }
  }
}
</script>