加入本行的数据为scope.row,其数据格式为
{
"propertyId": 4,
"propertyName": "标题",
"propertyType": 0
}
若是这里v-show=“scope.row.edit”,由于scope.row原本没有edit这个字段,当在vue的methods中改变edit值时,不能马上反应在view中。vue
因此只能绑定scope.row已存在的字段,可是又出现一个问题,改变绑定的字段时数据的变化会反应在表格数据上。数组
解决办法:绑定scope.row.propertyId,不改变其值,改变其类型,根据其类型设置按钮是否显示this
<el-table-column label="操做"> <template scope="scope"> <el-button size="small" type="primary" icon="edit" @click="handleEdit(scope.$index, scope.row)" v-show="typeof(scope.row.propertyId)=='number'"></el-button> <el-button size="small" type="danger" icon="delete2" @click="handleDelete(scope.$index, props.row.properties)" v-show="typeof(scope.row.propertyId)=='number'"></el-button> <el-button size="small" type="warning" icon="check" @click="handleEditOk(scope.$index, scope.row)" v-show="typeof(scope.row.propertyId)!=='number'"></el-button> </template> </el-table-column>
methods中spa
handleEdit(index, rowData) {
rowData.propertyId = rowData.propertyId.toString();
}
后来摸索,找到了最终解决方案:动态给全部数组记录 添加edit属性,code
JSON.parse(JSON.stringify(this.archives.paperRecord ? this.archives.paperRecord : []))
<el-table :data="recordTable"> </el-table
let data = JSON.parse(JSON.stringify(this.archives.paperRecord ? this.archives.paperRecord : []))
data.forEach(element => {
element['edit'] = false
});
this.recordTable = data