ant?design?vue的form表单取值方法

在Ant Design Vue中，获取表单的值可以通过以下几种方式：

1. 使用表单组件的ref属性

在表单组件上添加ref属性，然后可以使用this.$refs获取组件实例，在组件实例上调用getFieldsValue方法，该方法会返回一个包含表单所有组件的值的对象。

例如，我们有一个包含两个输入框的表单组件：

<template>
  <a-form ref="form">
    <a-form-item label="Username">
      <a-input v-decorator="['username']" />
    </a-form-item>
    <a-form-item label="Password">
      <a-input v-decorator="['password']" />
    </a-form-item>
  </a-form>
</template>

我们可以在表单组件外部的方法中，通过this.$refs获取表单组件实例，并调用getFieldsValue方法获取表单值：

methods: {
  getValue() {
    const form = this.$refs.form;
    const values = form.getFieldsValue();
    console.log(values); // { username: '', password: '' }
  }
}

2. 使用表单组件属性

表单组件中的value属性可以用来设置表单组件的值。可以通过v-model指令将表单组件的值与数据对象中的属性绑定，通过修改数据对象中的属性，就可以获取表单组件的值。

例如，我们有一个包含两个输入框的表单组件：

<template>
  <a-form :model="form">
    <a-form-item label="Username">
      <a-input v-model="form.username" />
    </a-form-item>
    <a-form-item label="Password">
      <a-input v-model="form.password" />
    </a-form-item>
  </a-form>
</template>

<script>
export default {
  data() {
    return {
      form: {
        username: '',
        password: '',
      }
    }
  },
  methods: {
    getValue() {
      console.log(this.form); // { username: '', password: '' }
    }
  }
}
</script>

我们可以在表单组件外部的方法中，通过this.form获取数据对象中的属性，从而获取表单值。

3. 在表单组件中使用v-decorator

v-decorator指令可以将表单组件的值与表单内的数据对象绑定。可以在表单组件上添加v-decorator指令，然后使用this.form获取表单内部的数据对象，从而获取表单值。

例如，我们有一个包含两个输入框的表单组件：

<template>
  <a-form :model="form">
    <a-form-item label="Username" v-decorator="['username']">
      <a-input />
    </a-form-item>
    <a-form-item label="Password" v-decorator="['password']">
      <a-input />
    </a-form-item>
  </a-form>
</template>

<script>
export default {
  data() {
    return {
      form: {
        username: '',
        password: '',
      }
    }
  },
  methods: {
    getValue() {
      console.log(this.form.username, this.form.password); // '', ''
    }
  }
}
</script>

我们可以在表单组件外部的方法中，通过this.form获取表单内部的数据对象，从而获取表单值。我们可以通过访问数据对象的属性来获取每个表单组件的值。