Element UI 表单验证：如何使用 verify 实现数据必填

Element UI 组件库提供了强大的表单验证功能，您可以使用 verify 属性来实现表单数据的必填验证。

实现步骤

添加 required 属性: 在表单中的每个字段上添加 required 属性，表示该字段为必填项。例如：

<el-input v-model='username' required></el-input>

使用 validate 方法: 在提交表单的方法中，使用 this.$refs.form.validate() 来验证表单数据。例如：

methods: {
  submitForm() {
    this.$refs.form.validate((valid) => {
      if (valid) {
        // 表单数据验证通过，可以执行提交操作
        // ...
      } else {
        // 表单数据验证不通过，显示错误提示信息
        // ...
      }
    });
  }
}

设置 ref 属性: 在表单的根元素上添加 ref 属性，以便在提交表单的方法中引用表单组件。例如：

<el-form ref='form'>
  <!-- 表单字段 -->
</el-form>

工作流程

当用户点击提交按钮时，会触发 submitForm 方法，该方法会调用 validate 方法来验证表单数据。如果表单数据验证通过，可以执行提交操作；如果表单数据验证不通过，可以显示错误提示信息。