布局

          <Row>
            <!-- 詳情 -->
            <FormItem :label="$t('userDetail')">
              <Button type="primary" @click="handleAdd">{{$t('add')}}</Button>
            </FormItem>
          </Row>
          <Form ref="formDynamic" :model="formDynamic" :label-width="100">
            <div  v-for="(item, index) in formDynamic.items" :key="index">
                <Row v-if="item.status">
                    <Col span="6">
                        <FormItem
                        :label="$t('thePurchaseTime')"
                        :prop="'items.' + index + '.thePurchaseTime'"
                        :rules="{required: true, message:'請?zhí)顚懶畔?, trigger: 'blur'}"
                        >
                            <Input v-model="item.thePurchaseTime" :disabled="editor" :maxlength="20"/>
                        </FormItem>
                    </Col>
                    <Col span="6">
                        <FormItem
                            :label="$t('theOriginalPrice')"
                            :prop="'items.' + index + '.theOriginalPrice'"
                            :rules="{required: true, message:'請?zhí)顚懶畔?, trigger: 'blur'}"
                        >
                            <Input v-model="item.theOriginalPrice" :disabled="editor" :maxlength="20"/>
                        </FormItem>
                    
                    </Col>
                    <Col span="6">
                    <FormItem
                        :label="$t('price')"
                        :prop="'items.' + index + '.price'"
                        :rules="{required: true, message:'請?zhí)顚懶畔?, trigger: 'blur'}"
                    >
                        
                        <Input v-model="item.price" :disabled="editor" :maxlength="20"/>
                        
                    </FormItem>
                    </Col>
                    <Col span="6">
                        <Button @click="handleRemove(index)">{{$t('delete')}}</Button>
                    </Col>
                </Row>
            </div>
            
          </Form>

參數(shù)

      index: 1,
      formDynamic: {
        items: [
          {
            thePurchaseTime: "",
            price: "",
            theOriginalPrice: "",
            index: 1,
            status: 1
          }
        ]
      }

方法

    //商城購買 新增數(shù)據(jù)
    handleAdd() {
      this.index++;
      this.formDynamic.items.push({
        value: "",
        index: this.index,
        status: 1
      });
    },
    //刪除所在行詳情數(shù)據(jù)
    handleRemove(index) {
        console.log(this.formDynamic.items)
      this.formDynamic.items[index].status = 0;
    //   this.formDynamic.items = this.formDynamic.items
    },