elementui dialog绑定rules

在 ElementUI 的 dialog 中，可以通过绑定表单验证规则（rules）来实现表单的验证。具体步骤如下：

1. 在 dialog 中添加一个表单，表单中包含需要验证的输入框等表单元素。

2. 在表单元素中添加 `v-model` 属性，用于绑定输入框的值。

3. 在表单元素中添加 `:rules` 属性，用于绑定验证规则。

例如，验证一个输入框必填且长度在 6-20 个字符之间，可以在模板中添加如下代码：

<el-dialog>
  <el-form>
    <el-form-item label="用户名" prop="username">
      <el-input v-model="username" :rules="[
        {required: true, message: '请输入用户名', trigger: 'blur'},
        {min: 6, max: 20, message: '长度在 6 到 20 个字符', trigger: 'blur'}
      ]"></el-input>
    </el-form-item>
  </el-form>
</el-dialog>

4. 在 dialog 的确认按钮（或提交按钮）的点击事件中，调用表单的验证方法 `validate`，判断表单是否通过验证。如果表单验证通过，则执行后续操作；否则，提示用户错误信息。

例如，在确认按钮的点击事件中，可以添加如下代码：

this.$refs.form.validate((valid) => {
  if (valid) {
    // 表单验证通过，执行后续操作
  } else {
    // 表单验证失败，提示用户错误信息
    this.$message.error('表单验证失败，请检查输入是否正确！');
  }
});

注意，这里的 `this.$refs.form` 是 dialog 中的表单组件的引用，需要在组件中添加 `ref` 属性来获取该引用：

<el-dialog>
  <el-form ref="form">
    ...
  </el-form>
</el-dialog>