element form表单动态添加新增一行

<el-form
   :model="noticForm"
   ref="noticForm"
   label-width="70px"
   :inline="true"
 >
   <el-row
     v-for="(noticItem, index) in noticForm.noticConfig"
     :key="index"
   >
     <el-col
       :span="10"
       v-for="(nameItem, index) in noticItem.name"
       :key="nameItem.key"
     >
       <el-form-item prop="name" label="姓名：">
         <el-input v-model="nameItem.value"></el-input>
       </el-form-item>
     </el-col>
     <el-col
       :span="10"
       v-for="(phoneItem, index) in noticItem.phone"
       :key="phoneItem.key"
     >
       <el-form-item prop="phone" label="电话：">
         <el-input v-model="phoneItem.value"></el-input>
       </el-form-item>
     </el-col>
     <el-col :span="4"
       ><el-button @click.prevent="removeDomain(noticItem)"
         >删除</el-button
       >
     </el-col>
   </el-row>
   <el-form-item style="width: 100%; text-align: center">
     <el-button type="primary" @click="submitForm('noticForm')"
       >提交</el-button
     >
     <el-button @click="addDomain">新增</el-button>
   </el-form-item>
 </el-form>




//data
noticForm: {
 noticConfig: [
     {
       name: [
         {
           value: "",
         },
       ],
       phone: [
         {
           value: "",
         },
       ],
     },
   ],
 },

// 新增
removeDomain(item) {
 var index = this.noticForm.noticConfig.indexOf(item);
  if (index == "0") {
    // 还有一个的时候提示不能删除
    this.$message({
      message: "不能删除了",
      type: "error",
    });
    return false;
  }
  if (index !== -1 && index !== "0") {
    this.noticForm.noticConfig.splice(index, 1);
  }
},
// 表单新增
addDomain() {
  this.noticForm.noticConfig.push({
    name: [
      {
        value: "",
        key: Date.now(),
      },
    ],
    phone: [
      {
        value: "",
        key: Date.now() + "2",
      },
    ],
  });
},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95