I want to write a form for verification, but the data in it is not fixed, it is traversed, and I don"t know how to write the rules
code here is https://jsfiddle.net/pbzgjv5e.

traverse from ruleForm like this, and then display

   ruleForm: {
      name: "",
      region: "",
      date1: "",
      date2: "",
    },

Code:

<div id="app">
  <el-form ref="ruleForm" :model="ruleForm" label-width="80px">
    <el-form-item v-for="(item,index) in Object.keys(ruleForm)" :label="item" prop="" :key="index">
      <el-input v-model="ruleForm[item]"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary"></el-button>
      <el-button></el-button>
    </el-form-item>
  </el-form>
</div>

data() {
  return {
    ruleForm: {
      name: "",
      region: "",
      date1: "",
      date2: "",
    },
    rules: {
      name1: [
        { required: true, message: "", trigger: "blur" },
      ],
    }
  };
},