如何在不改变的情况下保存数据js

Question

我有一个像这样的用户信息对象

data: function(){
  return {
    userinfo: {
       name:'',
       username:'',
       imagePath:''
   },
    previousUserInfo:{}
  }
 }

以及我显示此用户信息的其他地方：

<template>
  <div> user name: {{userinfo.name}}</div>
  <div> username: {{userinfo.username}}</div>
                  ....

在某些情况下，当前用户更改，我应该在previousUserInfo对象中保存以前的用户数据：

 this.$set(this, 'previousUserInfo', this.userinfo);

但是当用户在userinfo中填充新数据时，previousUserInfo数据也会发生变化。

我还尝试使用另一个变量来保存数据，但重新连接是相同的：

var previousUserInfo = this.userinfo;
this.$set(this, 'previousUserInfo', previousUserInfo);

问题是什么？

Answer 1

this.userinfo和this.previousUserInfo指向同一个对象。

您可以尝试执行this.userinfo

的深拷贝值

 this.$set(this, 'previousUserInfo', JSON.parse(JSON.stringify(this.userinfo));