elementui 多行表单，前一个字段填了，第二个必填

Element UI 提供了一个名为 `el-form` 的组件，用于构建复杂的表单结构，其中包括多行输入场景。当涉及到多行表单且有数据关联性时，比如第一个字段（假设是邮箱）填写后，下一个字段（如密码或确认密码）变为必填，你可以通过结合 Vue.js 的数据绑定和 `v-model`指令以及 Element UI 的验证规则来实现。

首先，在 Vue 组件模板里，你可以这样设置表单元素：

<template>
  <el-form :model="formData" :rules="rules">
    <el-form-item label="邮箱">
      <el-input v-model="formData.email"></el-input>
    </el-form-item>
    <el-form-item label="密码" required prop="password">
      <el-input type="password" v-model="formData.password"></el-input>
    </el-form-item>
    <!-- 可能还有其他字段 -->
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      formData: {
        email: '',
        password: ''
      },
      rules: {
        email: { required: true, message: '请输入邮箱', trigger: 'blur' }, // 邮箱验证
        password: [{ required: false, message: '请先填写邮箱', trigger: 'blur' }] // 初始状态非必填
      }
    };
  },
  watch: {
    formData(email) {
      if (email && !this.formData.password) {
        this.rules.password[0].required = true; // 当邮箱有值时，激活密码的必填验证
      } else {
        this.rules.password[0].required = false; // 否则取消必填验证
      }
    }
  }
};
</script>

在这个例子中，我们设置了 `password` 字段的初始验证规则为非必填，并在 `watch` 中监听 `formData.email` 的变化。当邮箱有值时，修改规则使其变成必填；如果没有值，则保持默认非必填。