javascript - vuejs 复制数据对象并删除属性也会从原始对象中删除该属性

Question

我在 vue 中有一个数据对象，看起来像这样

rows[
0 {
  title: "my title",
  post: "my post text",
  public: false,
  info: "some info"
},
1 {
 title: "my title",
  post: "my post text"
  public: true,
  info: "some info"
},
2 {
 title: "my title",
  post: "my post text"
  public: false,
  info: "some info"
}
]

然后我复制该对象并根据需要删除某些属性，然后再将对象发布到我的后端，如下所示:

var postData = this.rows;
      postData.forEach(function(o) {

        if (o.public === true) {
          delete o.info;
        }
      });

      var uploadData = {};
      uploadData.blogpost = postData;
      axios({
          method: 'post',
          url: myUrl,
          responseType: 'json',
          data: uploadData
        })

问题是 delete o.info; 也会从我的 vm 根数据中删除该属性，我不明白为什么，因为我创建了一个新的变量/复制根数据到那个。那么，如何在不更改 vue 中的根数据 vm 的情况下，在发布数据之前从我的数据中删除某些对象属性？

Answer 1

您需要通过克隆来获取数据的副本。克隆数据的方式有很多种，我推荐使用lodash的函数，cloneDeep

import _ from 'lodash'
...
postDataCopy = _.cloneDeep(postData)

然后你可以随意修改postDataCopy，而不用修改原来的。