vue3中,在setup语法糖的子组件中怎么使用watch监听defineProps接收父组件的值的变化?

子组件:
<template>
  <div>我是子组件</div>
</template>
<script setup>
//接收父组件传值
const props = defineProps({
  editData: {
    type: Object,
  },

//子组件怎么监听defineProps接收的父组件的editData的值的变化????

});
</script>


父组件:
<template>
<el-table
            :data="data.tableData"
            size="small" 
        style="width: 100%"
          >
            <el-table-column label="名称" align="center">
              <template #default="scope">
                <span>{{ scope.row.name }}</span>
              </template>
            </el-table-column>
            <el-table-column label="年龄" align="center">
              <template #default="scope">
                <span>{{ scope.row.age}}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="200" align="center">
              <template #default="scope">
                <el-button type="text" @click="handleEdit(scope.row)" class="buttonMargin">
                  <i class="el-icon-edit"></i>编辑</el-button
                >
              </template>
            </el-table-column>
          </el-table>
  <child :editData="data.editData"></child>
</template>
<script setup>
import { reactive } from 'vue'
import childfrom '@/components/child.vue'
 const data=reactive({
        tableData:[
            {name:"张三",age:15},
            {name:"李四",age:16},
           {name:"王五",age:17},
          ],
      editData:{}
  })
const handleEdit = (row) => {
  data.editData=row
}
</script>

我也遇到了这个问题,想问一下,你是怎么解决的啊


watch(
  ()=>props.editData,
  (n,o)=>{ 这里会触发 },
  { deep:true }
)

watch(props.editData, (n, o) => {
      console.log("editData改变了", n, o);
    });