van-form表单中有多个选择器 怎样写

你可以在 `van-form` 中使用 `van-field` 组件来创建选择器，如下所示：

<template>
  <van-form>
    <van-field
      v-for="(item, index) in fields"
      :key="index"
      :name="item.name"
      :label="item.label"
      :options="item.options"
      :value="item.value"
      @input="onFieldChange(index, $event)"
    />
  </van-form>
</template>

<script>
export default {
  data() {
    return {
      fields: [
        {
          name: 'category',
          label: 'Category',
          options: [
            { label: 'Option 1', value: 'option1' },
            { label: 'Option 2', value: 'option2' },
            { label: 'Option 3', value: 'option3' },
          ],
          value: '',
        },
        {
          name: 'color',
          label: 'Color',
          options: [
            { label: 'Red', value: 'red' },
            { label: 'Green', value: 'green' },
            { label: 'Blue', value: 'blue' },
          ],
          value: '',
        },
      ],
    };
  },
  methods: {
    onFieldChange(index, value) {
      this.fields[index].value = value;
    },
  },
};
</script>

在上面的代码中，我们使用 `v-for` 指令动态渲染出多个 `van-field` 组件，每一个组件都对应了一个选择器。我们通过 `fields` 数组来配置每一个选择器的名称、标签、选项等属性，并且为每一个选择器绑定了一个 `value` 属性，用来存储用户选择的值。当用户选择了一个新的值时，我们就会触发 `input` 事件，并调用 `onFieldChange` 方法来更新对应的 `value` 属性。

在这个例子中，我们使用了 `van-field` 组件提供的 `options` 属性来设置选择器的选项，同时也可以通过 `value` 属性来设置选择器的默认值。除此之外，`van-field` 还提供了很多其他的属性和事件，你可以根据自己的需要来选择使用。