vue3父子组件传值defineProps，子组件回调方法defineEmits

父组件

<template>
  <div id="app">
    <h3>父子组件传值defineProps，子组件回调方法defineEmits</h3>
    <el-button @click="changeListFun"
      >父组件修改值子组件跟着变化，无论数组换是对象</el-button
    >
    <h4>这是子组件给父组件传值：{
  
  { childToFatherData }}</h4>
    <h3>1 ref和组件名称不要相同 2 ref需要先被定义</h3>
    <!--传递一个id 一个list -->
    <homeCom
      ref="refHomeCom"
      :id="id"
      :list="list"
      :obj="obj"
      @chiLdToFatherFun="chiLdToFatherFun"
    ></homeCom>
  </div>
</template>

<script setup>
import { ref, onMounted, reactive } from "vue";
import homeCom from "./child.vue";
// 变量
const id = ref("1");
const refHomeCom = ref(null);
const list = reactive([1, 2, 3, 4, 5]);
const obj = reactive({ name: "张三" });
const childToFatherD