v-decorator如何绑定数组对象

`v-decorator` 是 `antd` 中用于表单校验的装饰器，可以通过 `rules` 属性来设置校验规则。如果要绑定数组对象，可以使用 `v-for` 指令来遍历数组，然后在每个元素上应用 `v-decorator`。

例如，假设有一个名为 `users` 的数组对象，其中每个元素都包含 `name` 和 `age` 两个属性，可以这样绑定：

<template>
  <div>
    <div v-for="(user, index) in users" :key="index">
      <a-input v-decorator="['users.' + index + '.name', { rules: [{ required: true, message: '请输入姓名' }] }]"></a-input>
      <a-input-number v-decorator="['users.' + index + '.age', { rules: [{ required: true, message: '请输入年龄' }] }]"></a-input-number>
    </div>
  </div>
</template>

在上述代码中，`v-for` 指令遍历了 `users` 数组，并将每个元素的 `name` 和 `age` 属性分别绑定到了 `a-input` 和 `a-input-number` 组件上，同时在它们上面应用了 `v-decorator`，其中 `v-decorator` 的第一个参数是绑定的字段名，使用了 `users.` + `index` + `.name` 和 `users.` + `index` + `.age` 的字符串拼接方式来动态生成绑定的字段名，确保每个元素都有独立的绑定。第二个参数是校验规则，这里设置了必填的校验规则。

需要注意的是，如果要在组件中使用 `v-decorator`，需要先在组件的 `setup` 方法中引入 `useForm` 函数，并调用它来获取表单实例对象。例如：

import { defineComponent } from 'vue'
import { useForm } from '@ant-design-vue/form'

export default defineComponent({
  setup() {
    const [form] = useForm()

    return {
      form,
    }
  },
})

这样就可以在组件中使用 `v-decorator` 来绑定表单字段了。