<template> <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> <template #default="{row,$index}"> <input type="text" v-model="row.date" v-show="row.display" /> <span v-show="!row.display">{{row.date}}</span> </template> </el-table-column> <el-table-column prop="name" label="姓名" width="180"> </el-table-column> <el-table-column label="操作" width="180"> <template #default="{row,$index}"> <el-button type="warning" @click="edit(row)">编辑</el-button> <el-button type="danger" @click="save(row)">保存</el-button> </template> </el-table-column> </el-table> </template> <script> export default { data() { return { tableData: [{ date: '2016-05-02', name: '王小虎' }, { date: '2016-05-04', name: '王小虎' }] } }, methods: { edit(row, index) { row.display = true; }, save(row, index) { row.display = false; } } } </script>