el-table用户可输入表格

1. 首先是表格中插入输入框–可利用插槽
2. 要控制输入框的显示，要加显示控制
3. 点击事件，鼠标移开输入框不显示

<el-table :data="tableData" v-loading="loading" :row-class-name="tableRowClassName" border max-height="780" style="width: 100%" size="mini" @cell-click="tabClick">      
	<el-table-column label="可编辑" 
	     <template slot-scope="scope">
	           <div
	                @click.stop
	                v-if="edit.rowIndex == scope.$index"
	                class="e-item"
	              >
	              <el-input
	                    clearable
	                    :ref="column.field + scope.$index"
	                    v-model="test"
	                    @blur="inputBlur"
	                  ></el-input>
	                </div>
	     </template>
	</el-table-column>
</el-table>

通过tableRowClassName设置index

tableRowClassName ({ row, rowIndex }) {
      // 把每一行的索引放进row
      row.index = rowIndex
}

通过单元格点击事件，设置edit.rowIndex值

// tabClick row 当前行 column 当前列
tabClick (row, column, cell, event) {
      switch (column.label) {
        case '可编辑':
          this.edit.rowIndex = row.index
          break
        default: return
      }
}

单元格失去焦点事件

// 失去焦点初始化
inputBlur (row) {
     this.edit.rowIndex = -1；
}