el-table 表格双击变成el-input框且聚焦，input框验证出错后聚焦

效果图
before：

after：

实现：
方法一 不推荐
HTML部分

<el-row :gutter="20" class="kong">
    <el-table :data="prototypes" style="width: 100%;">
    	// 序号栏目 type="index"
        <el-table-column type="index" label="序号" width="100"></el-table-column>
        // 此页重点部分  编辑之前以span形式显示，点击编辑之后，以input栏目显示
        <el-table-column label="字段名称" width="380">
            <template slot-scope="scope">
                <span v-if="scope.row.vVisible">{
   {
   scope.row.name}}</span>
                <el-input v-else v-model="scope.row.name"></el-input>
            </template>
        </el-table-column>
  		
        <el-table-column label="操作" width="160">
            <template slot-scope="scope">
                <div class="special">
                    <span v-if="scope.row.vVisible" class="items" @click="edit(scope.row)">编辑</span>
                    <span v-else class="items" @click="edit(scope.row)">保存</span&