美文网首页
vue编辑本行数据后,取消,恢复原数据

vue编辑本行数据后,取消,恢复原数据

作者: 空我我 | 来源:发表于2023-02-15 09:00 被阅读0次

v-model的双向绑定使得修改后的数据,无法恢复到原数据,就在点击编辑的时候暂存原数据,一种是用临时存储:uni.setStorageSync,另一种是用Object.assign,点取消按钮后重新赋值恢复原数据

editRow(row) {
                // 暂存原来的数据,
                // uni.setStorageSync('tempItem',row)
                this.tempItem = Object.assign({}, row)
                this.$set(row, 'editflag', true)
            },
            cancleRow(row){
                // 取消后重新赋值
                this.$set(row, 'editflag', false)
                this.$set(row, 'charge', this.tempItem.charge)
                this.$set(row, 'completeDate',this.tempItem.completeDate)
            },

相关文章

  • React学习随笔

    更新state、props中的复杂数据 数据操作 编辑数据 保存数据 取消编辑还原数据 删除数据 input的on...

  • vue组件间的通信

    1.vue2.0以后取消掉了子组件修改父组件数据,数据是:单向数据流。2.父组件给子组件传递数据:forexamp...

  • 第三次周测

    vi编辑器使用工作原理,如果出现编辑突然中断情况,如何恢复原来数据-r 如何查看linux系统中是否开启了8080...

  • RSA AES

    DES/AES加密速度快,适合大量数据,处理数据后可复原。 RSA加解密速度慢,不适合大量数据文件加密。 RSA用...

  • awk 查看日志

    一、自动将每行数据元素分配一个变量 $0:整个文本行; $1:代表文本行中的第1个数据字段; $n:代表文本行中的...

  • keep-alive使用后存在的问题

    使用vue2.0中的keep-alive来缓存页面,导致每次编辑页面保存后返回到list页的数据不会实时更新,接下...

  • vue-框架mvvm学习

    通过数据劫持实现vue(mvvm)框架 vue中最简单的表达式的使用如何实现渲染表达式里面的数据修改数据后如何更新...

  • .sync 修饰符

    应用场景:组件获取 props 外部数据后,需要修改数据。 Vue 规定:组件不能修改 props 外部数据;$e...

  • 关于涂色后“退回到上一步”功能的实现思路

    “退回到上一步”的功能,大体思路是这样的:将每一次涂色后的相关数据压栈,点击回退时,从栈中取出数据,根据这些数据恢...

  • 前端学习-VUE入门

    VUE:接管DOM操作,面向数据编程,当数据改变后,VUE会自动替换掉DOM里的内容 挂载点,模板和实例 计算属性...

网友评论

      本文标题:vue编辑本行数据后,取消,恢复原数据

      本文链接:https://www.haomeiwen.com/subject/wuvykdtx.html