Javascript Vue computed属性更改数据对象

我的数据基本上是这样的结构（this.terms）：

然后我输出计算结果，这样人们就可以通过标记过滤这个.terms

computed: {
    filteredTerms: function() {
        let self = this;
        let terms = this.terms; // copy original data to new var

        if(this.search.tags) {
            return terms.filter((term) => {
                let updated_term = {}; // copy term to new empty object: This doesn't actually help or fix the problem, but I left it here to show what I've tried.
                updated_term = term;

                let updated_posts = term.posts.filter((post) => {
                    if (post.tags.includes(self.search.tags)) {
                        return post;
                    }
                });

                if (updated_posts.length) {
                    updated_term.posts = updated_posts; // now this.terms is changed even though I'm filtering a copy of it
                    return updated_term;
                }
            });
        } else {
            return this.terms; // should return the original, unmanipulated data
        }
    }
},

filteredTerms（）返回类别，其中仅包含匹配的文章。因此，搜索“愤怒”只会返回“第二类”，只列出“雨果编织”

问题是，运行计算函数会更改this.terms中的第二个类别，而不仅仅是该函数中它的副本（terms）。它不再含有蛇皮。我把范围缩小到更新的帖子。这一行似乎也改变了这一点。我唯一能做的就是重置整个数据对象并重新开始。这不太理想，因为它会一直在加载内容。我需要先加载这个.terms，并保持不变，以便在有人清除其搜索条件后恢复到它

我尝试过使用lodash版本的filter和includes（尽管我真的没想到会有什么不同）。我尝试使用更复杂的方法来处理for循环和.push（）而不是过滤器

---

我错过了什么？感谢您花时间查看此内容。

尝试克隆对象而不是引用它，您应该执行以下操作：

   let terms = [];
   Object.assign(terms,this.terms);

让terms=this.terms

这并不复制数组，它只保存对This.terms的引用。原因是JS对象和数组是引用类型。这是一个有用的视频：

---

无论如何，请使用

this.terms.slice（）

复制数组。如果它是一个对象，您可以使用

{…this.terms}

我用以下内容更新了我的计算函数：

let terms = [];
for (let i = 0; i < this.terms.length; i++) {
    const term = this.copyObj(this.terms[i]);
    terms.push(term);
}

---

谢谢让我走上正确的道路！事实上，我不得不在术语数组中循环并在术语对象上运行Object.assign，但它正确地克隆了我的原始数据。很棒的视频！谢谢你的回复。今天我学到了一些新东西。

let terms = [];
for (let i = 0; i < this.terms.length; i++) {
    const term = this.copyObj(this.terms[i]);
    terms.push(term);
}

copyObj: function (src) {
    return Object.assign({}, src);
}