el-table的增删改查

1.编辑操作（1）接口返回的数据进行处理

realTimeData(this.page.pageSize, this.page.pageCurrent, param).then(res=>{
 let arr = res.data.list;
 arr.map(item=>{
    item['isEdit'] = false
})
this.tableData = arr
this.page.pageTotal = res.data.Count
})

（2）在el-table组件中

    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
        <template slot-scope="scope">
         <span v-show="!scope.row.isEdit">{{scope.row.date}}</span>
         <el-input  v-show="scope.row.isEdit" v-model="scope.row.date" ></el-input>
        </template>
      </el-table-column>
 .......
<el-table-column
      fixed="right"
      label="操作"
      width="100">
      <template slot-scope="scope">
        <el-button @click="handleEdit(scope.$index)" type="text" size="small">编辑</el-button>
        <el-button @click="handleDelete(scope.$index,scope.row)" type="text" size="small">删除</el-button>
<el-button @click="handleSave(scope.row)" type="text" size="small">保存</el-button>
      </template>
    </el-table-column>
    </el-table>

(3)编辑方法

handleEdit(index){
  this.$set(this.tableData[index],'isEdit',true)
},

2.新增一行

hangdleAddDetails(){ 
  getDefaultTime().then(res=>{
  this.newDate=res.data
  let obj={}
  obj.date='',
  obj.year='',
  obj.time='',
  this.tableData.push(obj)
})
}