如何在Vue.js，Vee验证插件中添加对$validator.errors的监视

<template>
  <div>
    <form @submit.prevent="submitForm">
      <input v-model="name" type="text" name="name" placeholder="Name">
      <span>{{ errors.name }}</span>
      <button type="submit">Submit</button>
    </form>
  </div>
</template>

<script>
import { ValidationObserver, ValidationProvider } from 'vee-validate';

export default {
  data() {
    return {
      name: '',
      errors: {},
    };
  },
  watch: {
    '$validator.errors'(newErrors) {
      this.errors = newErrors.items.reduce((acc, error) => {
        acc[error.field] = error.msg;
        return acc;
      }, {});
    },
  },
  methods: {
    submitForm() {
      this.$validator.validateAll().then((result) => {
        if (result) {
          // 表单验证通过，执行提交操作
        }
      });
    },
  },
};
</script>