在vue3中如何父子组件都使用v-model

子组件中使用modelValue 接收

const props = defineProps({
  modelValue: String
})
// 但不要直接在子组件中直接使用v-model=‘props.modelValue’ 虽然不影响功能 但是会一直报警告对于子组件来说props是只读属性
const val = ref(props.modelValue | '')
<input v-model='val' />

子组件中使用emit('update:modelValue') 来触发父组件更新

const emit =defineEmits<{
  (event: 'update:modelValue',val: String): void
}>

inpChange(e: keyboardEvent) => {
 emit("update:modelValue", e.target.value)
}

<input v-model='val'  @input='inpChange' />