v-decorator

v-decorator 是 Vue.js 中一个用于表单校验的修饰符。它是基于 async-validator 库实现的，可以方便地对表单进行验证和校验错误提示。

使用 v-decorator，你可以轻松地在 Vue 组件的模板中声明表单项，并对其进行校验。下面是一个示例：

<template>
  <form @submit="handleSubmit">
    <input v-decorator="['username', { rules: [{ required: true, message: '请输入用户名' }] }]">
    <button type="submit">提交</button>
  </form>
</template>

<script>
import { createForm } from 'vue-formily';

export default {
  setup() {
    const form = createForm();

    const handleSubmit = () => {
      form.validate((valid) => {
        if (valid) {
          // 表单验证通过，处理提交逻辑
        }
      });
    };

    return {
      form,
      handleSubmit,
    };
  },
};
</script>

在上面的示例中，我们通过 v-decorator 定义了一个名为 username 的表单项，并指定了必填规则。当用户点击提交按钮时，会调用 `handleSubmit` 方法进行表单验证，并根据验证结果处理提交逻辑。

v-decorator 的第一个参数是表单项的字段名，第二个参数是一个对象，其中 rules 属性定义了该表单项的校验规则。可以通过 rules 属性指定多条规则，并可以自定义校验错误提示信息。

需要注意的是，v-decorator 必须与 vue-formily 库一起使用，所以上述示例中我们引入了 createForm 方法来创建一个表单实例。