vue+elementUI动态增加表单项并添加验证的代码详解

参考elementUI官网以及网上的其他一些资料。话不多说，直接贴代码。
htmt部分：

				?

									<div id="app" style="width: 500px;">

									        <el-form :model="environmentForm" ref="environmentForm">

									            <el-row :gutter="24" v-for="(item, index) in environmentForm.items" :key="item.key">

									                <el-col :span="6">

									                    <el-form-item :prop="'items.' + index + '.name'"

									                        :rules="{required: true, message: '名称不能为空', trigger: 'blur'}">

									                        <el-input v-model="item.name"></el-input>

									                    </el-form-item>

									                </el-col>

									                <el-col :span="6">

									                    <el-form-item :prop="'items.' + index + '.variable'"

									                        :rules="{required: true, message: '变量值不能为空', trigger: 'blur'}">

									                        <el-input v-model="item.variable"></el-input>

									                    </el-form-item>

									                </el-col>

									                <el-col :span="3" v-if="environmentForm.items.length !== 1">

									                    <el-button @click="removeEnvironmentForm(item)" class="el-icon-delete" size="mini" circle>

									                    </el-button>

									                </el-col>

									                <el-col :span="3">

									                    <el-button @click="addEnvironmentForm" size="mini" class="el-icon-plus" circle></el-button>

									                </el-col>

									            </el-row>

									            <el-form-item>

									                <el-button type="primary" @click="submitForm('environmentForm')">提交</el-button>

									                <el-button @click="resetForm('environmentForm')">重置</el-button>

									            </el-form-item>

									        </el-form>

									    </div>