el-table-column 列表中可编辑，在el-table表格中进行编辑修改操作

el-table-column 列表中可编辑，在el-table表格中进行编辑修改操作_el-table-column可编辑_不想学习只想玩的博客-CSDN博客

在el-table表格中直接进行编辑新增操作，不单独出弹窗。

 <el-table-column label="海区" align="center">
                        <template slot-scope="scope">
                            <el-form-item :prop="'seaData.' + scope.$index + '.seaAreaName'"
                                :rules="seaList.rules.seaAreaName">
                                <span v-if="(scope.row.isEdit)" class="red-sea">*</span>
                                <el-input size="mini" v-if="(scope.row.isEdit)" v-model.trim="scope.row.seaAreaName"
                                    clearable maxlength="30" placeholder="请输入海区" />
                                <span v-else v-text="scope.row.seaAreaName"></span>
                            </el-form-item>
                        </template>
                    </el-table-column>
                    <el-table-column align='center' label="操作" fixed="right">
                        <template slot-scope="scope">
                            <!-- <el-button @click="handleSeaView(scope.row.id)" type="text" size="small">详情</el-button> -->
                            <el-button v-if="(scope.row.isEdit)" @click="handleSeaSave(scope.row)" type="text"
                                size="small">保存</el-button>
                            <el-button v-else @click="handleSeaEdit(scope.row)" type="text" size="small">编辑</el-button>
                            <el-button v-if="(scope.row.isEdit)" @click="handleSeaCancel(scope.row)"
                                style="color: gray;" type="text" size="small">取消</el-button>
                            <el-button v-else @click="handleSeaDel(scope.row.id)" style="color: red;" type="text"
                                size="small">删除
                            </el-button>
                        </template>
                    </el-table-column>

新增时，在当前数据中最前面添加一条数据

this.seaList.seaData.unshift({
                    seaAreaName: '',
                    isEdit: true  //判断是否是输入框
                })