vue Object.assign 导致数据回填，输入框不可以输入，也不可以删除值。

最新推荐文章于 2023-07-04 22:42:41 发布

System.out.print

最新推荐文章于 2023-07-04 22:42:41 发布

阅读量993

点赞数

分类专栏： vue 文章标签： vue 前端 js

本文链接：https://blog.csdn.net/weixin_40841731/article/details/105789935

版权

vue 专栏收录该内容

42 篇文章 4 订阅

订阅专栏

1、业务场景，在页面中，监听输入框值改变，就将值存入本地缓存。下次进入页面的时候，提醒用户还有没保存的数据，是否立即编辑。

2、代码如下：

 watch: {
      form: {
        handler(newVal) {
          this.saveForm();
        },
        deep: true
      },
      otherForm: {
        handler(newVal) {
          this.saveForm();
        },
        deep: true
      }
}
 methods: {
    saveForm() {
        let self = this;
        let form = Object.assign(self.form, self.otherForm);
        localStorage.setItem("form", JSON.stringify(form));
    },
},

3、解决：

      saveForm() {
        let self = this;
        let formbrefore = JSON.parse(JSON.stringify(self.form))
        let form = Object.assign(formbrefore, self.otherForm);
        localStorage.setItem("form", JSON.stringify(form));
      },