vue组件封装实现v-model

首先在父组件中

<template>
    <DrawInferencesInput   v-model="answerForm" />
<template>
<script setup>
     const answerForm = ref()
</script>

在子组件中接收一个props，这里注意如果父组件传递时写的是v-model就接收modelValue，如果父组件传递时写的是v-model：value那么这里就接受的是value。
并且接收一个事件update:modelValue
在输入框输入的时候将输入的值通过事件传递给父组件即可

<template>
	<input
      :value="inputVal"
      @input="updateValue"
    >
</template>
<script setup lang="ts">
import { ref } from 'vue'
const props = defineProps({
  modelValue: {
    type: String,
    default: ''
  }
})
const emit = defineEmits(['update:modelValue'])
const updateValue = (e) => {
  inputVal.value = e.target.value
  emit('update:modelValue', inputVal.value)
}
</script>

这样就实现了自己封装的input组件的v-model