问题遇到的现象和发生背景
vue相关,更改选中行的数据。
选中行row,然后传递数据给弹窗dialog,在里面更改完后再传递给父组件el-table。
这里操作按钮是在el-table外部。
问题相关代码,请勿粘贴截图
// 编辑行
editRow(val, origin) {
console.log(val)
console.log('上面是更改数据,下面是原始数据')
console.log(origin)
//在原始数据中根据id来查找更改行的索引
let index = this.tableData.findIndex(
(item) => item.deviceId === origin.deviceId
)
console.log(index)
//然后替换成性新修改的值
this.tableData.splice(index, 1, val)
this.checkData = []
//重新搜索空内容,展示原始数据
this.searchRow(null)
}
我的解答思路和尝试过的方法
我尝试使用当前选中行的【行数】来作为条件查询索引,但如果是在【查询】后再对查询结果选中编辑的话,所返回的索引就和原始tableData内对不上。
譬如是我查询1条id为15的数据,原始数据中他的行数为10,但查了过后行数为1,此时修改的话原始数据中原本行数1的内容就被替换掉了。
但如果直接用id来进行查询索引的话,无法保证表格中该字段不存在重复值(主键作查询条件确实可以,确保唯一性)但如果不能暴露主键呢?
我想要达到的结果
想要的结果就是,子组件返回编辑后的内容时,无论是否为查询过以及是否字段有重复值,都要准确无误地正好将修改内容给到当前选中行,而非其他行!不想在table里面加编辑字段