Vee验证错误消息不会消失

Question

我正在尝试使用vee-validate来构建Vue输入组件，以输入错误消息。所有错误均正常运行，但是当我尝试彼此确认两个输入时，错误消息会弹出但永远不会消失。

我的组件

<template lang="pug">
div
  .label {{ label }}
    input(:type="type"
          :value="value"
          @input="$emit('input', $event.target.value)"
          @change="$emit('input', $event.target.value)"
          :placeholder="placeholder"
          v-validate="validation"
          :name="name"
          :ref="name")
  .message
    img(v-if="errors.first(name)" src="/static/icons/error-input.svg")
    .field(v-if="errors.first(name)") {{ errors.first(name) }}
</template>

<script>
export default {
  inject: ['$validator'],

  $_veeValidate: {
    name () {
      return this.name
    },
    value () {
      return this.value 
    }
  },

  props: {
    label: {
      type: String,
      required: false
    },
    placeholder: {
      type: String,
      required: false
    },
    validation: {
      type: String,
      required: false,
      default: ''
    },
    type: {
      type: String,
      default: 'text',
      required: false
    },
    value: {
      type: String
    },
    name: {
      type: String
    }
  }
}
</script>

当我要确认两封电子邮件时，如何从父组件中调用它：

<template lang="pug">
v-form
  text-input(v-model="email"
             validation="required|email"
             name="email")

  text-input(v-model="confirm_email"
             validation="required|email|confirmed:email"
             name="confirm_email")
</template>

<script>
import { mapActions } from 'vuex'
import textInput from '@/newDesignComponents/inputs/input'

export default {
  $_veeValidate: {
    validator: 'new' // please set a $validator for this component
  },

  data () {
    return {
      email: null,
      confirm_email: null
    }
  },
  components: {
    textInput
  }
}
</script>

如果有人可以帮助我，那将很棒！