方案一(传统方案,set不执行)
<script lang="ts">
import { computed} from 'vue'
export default defineComponent({
props: {
modelValue: {
type: Object,
required: true
}
},
emits: ['update:modelValue'],
setup(props, { emit }) {
const formData = computed({
get: () => {
return props.modelValue
},
set: (newValue) => {
emit('update:modelValue', newValue)
}
})
return {
formData
}
}
方案2(这个更好用)
const formData = ref({ ...props.modelValue })
// 当数据发生改变的时候 将数据发送出去
watch(
formData,
(newValue) => {
emit('update:modelValue', newValue)
},
{
deep: true
}
)
return {
formData
}