vue3 reactive赋值丢失相应性怎么解决啊？

Question

form表单的值一直赋值不上，查了一下资料说，reactive赋值会丢失响应，这篇文章说的，请问我用setup语法糖，怎么解决怎么个问题

  <template>
    <el-form>
      <el-form-item label="上级组织ID">
        <el-input
          v-model="form.pid"
        />
      </el-form-item>
    </el-form>
  </template>
  <script setup>
  const form = reactive({
    pid: '', // 父级ID
    name: '', // 名称
    code: '', // 编号
  })
  const props = defineProps({
    pid: {
      type: Number,
      default: 0
    },
  })

   onMounted(() => {
     form.pid = props.pid
   })
  </script>

Answer 1

这应该不是vue3的问题，我把你代码复制进我项目里，由于我没安装 element 所以换成了普通 <input /> 标签，运行了一下没问题，所以应该是 element 的bug

Answer 2

watch(() => props.pid, _ => 
    (form.pid = _))

生命周期没理解好！！！

Answer 3

要 watch 下