前言

在 Vue2 中父组件使用 $refs 调用子组件数据和方法非常简单，但在 Vue3 中这种方法行不通了。

本文实现了 Vue3 中父组件使用 $refs 获取调用子组件数据和方法教程，

并且提供了 setup() 与 <script setup> 两种 “开发模式” 的示例代码，请根据需要进行选择。

---

网上的文章教程太乱且大部分都没遵守 “标准语法” ，全是各种问题 BUG 根本用不了，

本文采用最新官方标准语法，给出超级详细的注释和示例代码。

---

＜script setup＞ 语法糖

以下示例，清楚的表示了如何实现。

父组件：

<template>
  <div>
      <!-- 子组件 --