業(yè)務(wù)開發(fā)需求.表格動(dòng)態(tài)添加娇掏，也可刪除，實(shí)現(xiàn)如下圖：

  <el-table
                :data="tableData"
                style="width: 100%"
                border>
            <el-table-column
                    prop="bookname"
                    :label="recoveryOne"
                    width="140px">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.bookname" type="number"></el-input>
                </template>
            </el-table-column>

            <el-table-column
                    prop="bookvolume"
                    :label="recoveryTwo"
                    width="140px">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.bookvolume" type="number"></el-input>
                </template>
            </el-table-column>

            <el-table-column
                    prop="bookborrower"
                    :label="recoveryThree"
                    width="150px">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.bookborrower" type="number"></el-input>
                </template>
            </el-table-column>

            <el-table-column>
                <template slot-scope="scope">
                    <button @click="addLine"
                            class="addBtn"
                            v-if="scope.$index == tableData.length - 1">
                        <i class="el-icon-plus"></i>
                    </button>

                    <button v-if="tableData.length > 1"
                            @click="handleDelete(scope.$index, scope.row)"
                            class="del-btn">
                        <i class="el-icon-minus"></i>
                    </button>
                </template>
            </el-table-column>
        </el-table>

export default {
    data() {
        return {
            tableData:[{
                bookname: '',
                bookborrower: '',
                bookvolume:''
            }]
        }
    },
    methods:{
        addLine(){ //添加行數(shù)
            var newValue = {
                  bookname: '',
                  bookborrower: '',
                  bookvolume:''
              };
            //添加新的行數(shù)
            this.tableData.push(newValue);
        },
        handleDelete(index){ //刪除行數(shù)
            this.tableData.splice(index, 1)
        },
        save(){
          //這部分應(yīng)該是保存提交你添加的內(nèi)容
          console.log(JSON.stringify(this.tableData))
        }
    }
 
}

最后還需要提醒大家一點(diǎn)勋眯，本篇文章中的例子僅供參考學(xué)習(xí)婴梧，切誤將本篇文章中的代碼直接使用在正式項(xiàng)目當(dāng)中下梢。希望以上代碼對大家有所幫助。