解决vue2+elementUI的下拉框出现自动校验的问题

在Vue 2 + Element UI中，下拉框（Select）组件可能会遇到自动验证的问题，即在选择不同的选项时，表单无需提交即可触发验证。这通常是因为Element UI的Select组件与Vue的v-model双向数据绑定在一起，而Vue的数据变化触发了验证。

解决方法：

1. 使用.lazy修饰符来延迟验证：

   在<el-select>上添加lazy属性，这样验证将在change事件后而不是input事件后触发。

<el-select v-model="selectedValue" lazy>
  <!-- options -->
</el-select>

2. 使用.number修饰符，如果需要将选项的值转换为数字类型：

   在<el-select>上添加number属性，这样选中的值会自动转换为数字类型。

<el-select v-model="selectedValue" number>
  <!-- options -->
</el-select>

3. 使用计算属性（Computed Property）来控制绑定值，而不是直接使用数据属性：

   这样可以在数据变化前进行自定义逻辑处理。

computed: {
  selectedValue: {
    // getter
    get() {
      return this.value; // 返回实际绑定的数据值
    },
    // setter
    set(value) {
      this.value = value; // 设置实际绑定的数据值
      // 这里可以添加额外的逻辑，例如触发验证
      this.$refs.form.validateField('selectField');
    }
  }
}

4. 使用validate-event属性控制是否触发验证：

   在<el-form>上设置validate-event="change"，这样只有在输入框的值改变后才会触发验证。

<el-form ref="form" :model="form" :rules="rules" validate-event="change">
  <!-- form items -->
</el-form>

以上方法可以根据具体情况选择使用，以解决下拉框（Select）组件在Vue 2 + Element UI中的自动验证问题。