如何给另一个新建的表单在表单重置上起名字？
如图，我需要在一个页面上建两个表单，当我给新表单起名form1时，重置名起名reset1，问题来了，根据原有的this.resetform基础上加个1，运行却显示报错
而当我删掉this.resetform1，却出现表单点击新增和删除都没有反应的情况（新增是增加一条姓名电话岗位这些文本框的条目），点取消也没有反应，并且每个条目输入的数据都会同步，问题是不是出在resetform上呢？
（能够成功修改和保存数据）
<!-- 添加或修改编辑队伍人员对话框 -->
<el-dialog :title="title" :visible.sync="edit" width="500px" append-to-body>
<el-form ref="form1" :model="form1" :rules="rules1" label-width="80px">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="lineAdd"
>新增</el-button>
</el-col>
<div v-for="(item, index) in form1" :key="index">
<el-form-item label="姓名" prop="name">
<el-input v-model="form1.name" placeholder="请输入姓名" />
</el-form-item>
<el-form-item label="电话" prop="peoplephone">
<el-input v-model="form1.peoplephone" placeholder="请输入电话" />
</el-form-item>
<el-form-item label="岗位" prop="position">
<el-select v-model="form1.position" placeholder="请选择岗位">
<el-option
v-for="dict in dict.type.position"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</div>
</el-form>
<el-col :span="3">
<el-button
size="mini"
type="text"
@click="deleteRow()"
>删除</el-button>
</el-col>
<div slot="footer" class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitEdit">保 存</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
// 表单校验
rules1: {
name: [
{required: true, message: "姓名不能为空", trigger: "blur"}
],
peoplephone:
[
{required: true, message: "电话不能为空", trigger: "blur"}
],
position:
[
{required: true, message: "岗位不能为空", trigger: "change"}
],
}
}
;
},
created() {
this.getList();
this.getEditpeopleList();
},
methods: {
/** 查询team列表 */
getList() {
this.loading = true;
listTeam(this.queryParams).then(response => {
this.teamList = response.rows;
this.total = response.total;
this.loading = false;
});
},
getEditpeopleList()
{
this.loading = true;
listEditpeople(this.queryParams).then(response => {
this.EditpeopleList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: undefined,
teamname: undefined,
address: undefined,
leader: undefined,
phone: undefined,
city: undefined,
situation: undefined,
leaderteam: undefined,
createBy: undefined,
createTime: undefined,
updateBy: undefined,
updateTime: undefined,
};
this.resetForm("form");
},
reset1() {
this.form1 = {
name: undefined,
peoplephone: undefined,
position: undefined,
};
},
// 选中某一行修改或移除
selectItem(row, column, event) {
this.selectedFundRow = row
if (event.target.innerText == "删除") {
this.deleteRow(this.selectedFundRow)
}
},
// 删除指定行
deleteRow(params) {
this.editpeopleList = this.editpeopleList.filter((ele) => {
var flag = false
// 如果不一致，则保留该行
for (const key in params) {
if (ele[key] != params[key]) {
flag = true
break
}
}
return flag
})
// 如果全部删除后没有可以点击的一行了，需要加一行空行
if (!this.editpeopleList.length) {
this.lineAdd()
}
},
/** 添加记录按钮操作 */
/**
* 新增<前端假新增>
*/
lineAdd() {
const newLine={
name: '',
peoplephone: '',
position: ''
}
this.index++
this.editpeopleList.push(newLine)
},
/** 分配队员按钮操作 */
handleEdit(row) {
this.loading = true;
this.reset1();
const teamname = row.teamname || this.ids
getEditpeople(teamname).then(response => {
this.loading = false;
this.form1 = response.data;
this.edit= true;
this.title = "编辑队伍人员";
});
},
/** 提交按钮 */
submitEdit() {
this.$refs["form1"].validate(valid => {
if (valid) {
this.buttonLoading = true;
if (this.form1.name != null) {
updateEditpeople(this.form1).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getEditpeopleList();
}).finally(() => {
this.buttonLoading = false;
});
} else {
addEditpeople(this.form1).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getEditpeopleList();
}).finally(() => {
this.buttonLoading = false;
});
}
}
});
},
