element ui动态渲染表单（数组）并验证
1、需求：
点击编辑按钮，弹出编辑框（表单），从后端拿到字段后动态渲染到页面上，并校验必填
2、代码实现
其中：specialColumns是从后端拿到的json数组,格式如下：
[
{
columnName: "操作"
columnType: "enumeration"
columnValue: "再次上报,废弃"
controlId: "FormProperty_08tc63f"
}
]
然后：
1：temp：指经过处理的【再次上报,废弃】数组
2：tempValue：指对应选择框的options
注意：prop的写法 :prop="'processColumns['+i+'].userValue'"
<el-dialog :visible.sync="editContent" title="编辑" @close="closeDialog">
<el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="120px">
<el-row v-if="tempFlag" :gutter="16">
<el-col v-for="(item,i) in temp" :span="12">
<el-form-item :label="item"
:prop="'processColumns['+i+'].userValue'"
:rules="[{ required:true,message:'输入不能为空',trigger: 'change' }]"
:key="i">
<el-select v-model="ruleForm.processColumns[i].userValue"
clearable
placeholder="请选择">
<el-option
v-for="(item,i) in tempValue[i]"
:label="item"
:value="item"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-dialog>
3、错误情况：input左侧出现星号,内容为空却不提醒**
原因:已经写好了验证功能,但是没有绑定到input框 .
解决方法:是标签加入prop="数组内要验证的属性"或者标签中加入type=“数组内要验证的属性”.如上代码所示（prop绑定的内容不能写错）
的属性"或者标签中加入type=“数组内要验证的属性”.如上代码所示（prop绑定的内容不能写错）
最终效果图：
