实现动态增减表单

 <el-row style="background:#F7F8F9;margin-top:20px">

            <el-col v-for="(item,index) in invoiceList" :key="item.value" :span="12" style="padding-top:10px">

              <el-form-item label-width="130px">

                <span style="margin-left:55px;margin-right:5px;"> 开票类型 </span>

                <el-select v-model="item.Rate_Key" clearable style="width: 240px">

                  <el-option

                    v-for="item in invoiceTypeList"

                    :key="item.Id"

                    :label="item.Name"

                    :value="item.Id"

                  />

                </el-select>

                <span style="margin-left:5px;margin-right:5px"> 开票金额(元) </span>

                <el-input v-model="item.Price" style="width: 240px" type="number" clearable  />

                <el-button v-if="index!=0" style=" margin-left: 25px;background: rgba(251, 107, 127, 0.08);color:#FB6B7F;border: 1px solid #FB6B7F;;border-radius: 4px;" icon="el-icon-minus" @click="delInvoices(index)" />

                <el-button v-if="index == 0" style="margin-left: 25px;background: rgba(41, 141, 255, 0.08);color:#298DFF;border: 1px solid #298DFF;border-radius: 4px;" icon="el-icon-plus" @click="addInvoices()" />

              </el-form-item>

            </el-col>

          </el-row>

  data() {

    return {

         invoiceList: [{}],

        }

}

    addInvoices() {

      this.invoiceList.push({})

    },

    delInvoices(index) {

      this.invoiceList.splice(index, 1)

    },

  this.invoiceList.forEach((item, index) => {

        if (JSON.stringify(item) == '{}') {

          this.invoiceList.splice(index, 1)

        }

      })