vue3 prop用于初始值

官方文档中对prop的教程中提到，prop是单向数据流，不推荐子组件改变父组件的值。如果prop只是用作初始值时，只需要用 ref 包裹即可，这样的话，新声明的变量之后变化就与prop无关了，而且也不会影响到父组件，这样不仅用作初始值，而且同时具有响应性。注意，如果传过来的prop是复杂数据类型，不仅要用ref包裹，还要先深拷贝，不然包裹住的仅仅是一个引用类型的地址而已。
官网示例 简单数据类型

const props = defineProps(['initialCounter'])

// 计数器只是将 props.initialCounter 作为初始值
// 像下面这样做就使 prop 和后续更新无关了
const counter = ref(props.initialCounter)

复杂数据类型

const props = defineProps(['couterInfo'])

// 计数器只是将 props.initialCounter 作为初始值
// 像下面这样做就使 prop 和后续更新无关了
const counter = ref(deepClone(props.couterInfo))