vue3： 利用props属性创建表单初始值

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

实践过程中踩的一个坑，记录一下。

一、实现步骤：

1. 定义props：const props = defineProps<{name: object}>()
2. 通过ref复制一份props属性的值： let propsRef = props.name
3. 通过watch来监测props的变化，以更新我们定义的ref的值

   watch(()=>props.name,(newValue,oldVlue)=>propsRef.value = newValue);
   

4. 通过v-model 来使用我们定义的引用：

   <form>
   	<input v-model=" propsRef.*** "/>
   </form>
   

总结

使用ref来复制的过程相当于 使用props的属性值来做ref的初始值，props值变化的时候ref的值不会变化，要手动监测。
这和react中props变化的时候，整个函数重新执行的流程是不一样的。