我有这个自定义文本输入。它返回v-model值，但有两个问题。
1.当我在created（）上设置一个值时，它设置了modelValue和inputValue，但是 meta.valid仍然设置为false，无法继续验证。
1.当我在watch（）上设置一个值时，它设置了modelValue而不是inputValue，并且 meta.valid为false。

<template>
  <div
    class="TextInput"
    :class="{ 'has-error': !!errorMessage, 'success': meta.valid }"
  >
    <label :for="name">{{ label }}</label>

      <input
        :name="name"
        :id="name"
        :type="type"
        :placeholder="placeholder"
        :value="modelValue"
        :class="inputClass"
        @input="onInput($event)"
        @blur="handleBlur"
      />

    <p class="help-message" v-show="errorMessage || meta.valid">
      {{ errorMessage || successMessage }}
    </p>
  </div>
</template>

<script>
import { useField } from "vee-validate";

export default {
  props: {
    type: {
      type: String,
      default: "text",
    },
    value: {
      type: String,
      default: "",
    },
    name: {
      type: String,
      required: true,
    },
    label: {
      type: String,
      required: false,
    },
    successMessage: {
      type: String,
      default: "",
    },
    placeholder: {
      type: String,
      default: "",
    },
    modelValue: {
      type: [String, Number],
      description: "Input value",
    },
    inputClass: {
      type: String,
      default: "",
    },
  },
  setup(props, {emit}) {
    const {
      value: inputValue,
      errorMessage,
      handleBlur,
      handleChange,
      meta,
    } = useField(props.name, undefined, {
      initialValue: props.modelValue,
      valueProp: props.modelValue
    });

    const onInput = (event) => {
      handleChange(event, true)
      emit('update:modelValue', event.target.value)
    }

    return {
      onInput,
      handleChange,
      handleBlur,
      errorMessage,
      inputValue,
      meta,
    };
  }
};
</script>