Vue.js 自定义输入组件上的vue更改事件

我想在自定义输入组件上添加

@change

事件

这是我的组件：

<template>
  <div class="w-100">
    <div class="form-text">
      <input
        :value="value"
        @input="updateValue($event.target.value)"
        autocomplete="off"
        class="form-text__input"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: 'FormText',
  props: {
    value: {
      required: true,
      type: String
    }
  },
  methods: {
    updateValue(value) {
      this.$emit('input', value)
    }
  }
}
</script>

       <form-text
          v-model="form.placeOfBirth"
        />

导出默认值{
名称：“FormText”，
道具：{
价值：{
要求：正确，
类型：字符串
}
},
方法：{
updateValue（值）{
此.$emit（'input'，value）
}
}
}

我就是这样使用它的：

<template>
  <div class="w-100">
    <div class="form-text">
      <input
        :value="value"
        @input="updateValue($event.target.value)"
        autocomplete="off"
        class="form-text__input"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: 'FormText',
  props: {
    value: {
      required: true,
      type: String
    }
  },
  methods: {
    updateValue(value) {
      this.$emit('input', value)
    }
  }
}
</script>

       <form-text
          v-model="form.placeOfBirth"
        />

我想添加

@change

事件。此事件应在用户开始键入输入时触发，而不是在数据来自API且输入已填充时触发。

在模板中：

    <input
    ...
    @keyup="onKeyUp"
    />

请注意，此事件将在每次按键后触发