<template> <div class="content"> <div class="demo"> <el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign"> <div class="formContent" v-for="(item,index) in pfzyData"> <h2>个人信息{{pfzyData.length > 1 ? index + 1 : ''}}</h2> <el-form-item label="姓名"> <el-input v-model="item.name" placeholder="请输入姓名"></el-input> </el-form-item> <el-form-item label="性别"> <el-input v-model="item.sex" placeholder="请输入性别"></el-input> </el-form-item> <el-form-item label="学校"> <el-input v-model="item.school" placeholder="请输入院校"></el-input> </el-form-item> </div> </el-form> </div> <div class="add" @click="addItem"><el-button type="info">添加</el-button></div> <div class="btn" @click="submitBtn"><el-button type="primary">提交</el-button></div> </div> </template> <script> export default { name: "formAdd", props: {}, data() { return { labelPosition: 'right', formLabelAlign:{ name:'', sex:'', school:'', }, pfzyData: [ { name: '', sex: '', school: '' } ], }; }, methods: { addItem (){ var obj = { name: '', sex: '', school: '' } this.pfzyData.push(obj) }, submitBtn() { var data = [] for (var i = 0; i < this.pfzyData.length; i++) { var obj = {} obj.name = this.pfzyData[i].name obj.sex = this.pfzyData[i].sex obj.school = this.pfzyData[i].school data.push(obj) } console.log(data) this.axios.post(this.Host+'/doctor/xxx.action', //换成自己的请求地址 { jsonRpStr: JSON.stringify(data) } ) .then((res)=>{ console.log(res.data.respCode,'890-') if (res.data.respCode == 1001) { this.$message('提交成功~') }else{ this.$message('哈哈哈,参数错误了') } }) .catch((error)=>{ console.log(error); }); }, }, components: {}, }; </script> <style lang="scss" scoped="" type="text/css"> div { margin-top: 10px; } input { border: 1px solid #999; } .content{ padding:1rem 8rem; } </style>
涉及到图片上传的:https://i.cnblogs.com/files ——pfzy.zip