对于动态增减表单项,Element UI 官方文档表单那一节已经介绍得很清楚了,我之前没有看见,绕了很多弯路,这里针对点击按钮增删一排输入框的问题做一个总结。
效果图如下
存在一排必填的姓名与手机号,点击增加后会新增一行,点击每行后面的删除图标则会删除该行
必填项很简单,就是普通表单:
<el-form ref="form" :rules="formRules" :inline="true" :model="form" label-width="80px" > <!-- 固定项目 --> <el-form-item label="姓名" prop="name"> <el-input v-model="form.name" palceholder="请输入姓名"> </el-input> </el-form-item> <el-form-item label="手机号" prop="phone">