计算属性导致数组和对象突变

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了计算属性导致数组和对象突变相关的知识,希望对你有一定的参考价值。

我正在尝试将数据传递给v-select下拉列表。这当然有效:

computed: 
  itemDropdown() 
    const menuItems = 
        id: "1",
        name: "Joe"
      
    return menuItems;
  

但是当我尝试时:

computed: 
  itemDropdown() 
      const newArray = [...this.data.originalItems];
      newArray.map(item => 
        item.name = "myCoolNewName";
      );
      return newArray;
  

它会改变原始数组。我也尝试过复制对象:

computed: 
  itemDropdown() 
      const newObj =  ...this.data ;
      newObj.items.map(item => 
        item.name = "myCoolNewName";
      );
      return newObj;
  

不确定我想念的是什么,但想知道是否有解决方法。感谢您的帮助:slight_smile:

答案

您使用的地图数组方法错误。

您需要知道的第一件事是map方法返回一个new数组,因此您必须返回map函数的结果或将其保存在变量中,否则您将循环遍历您的阵列,却从未将其保存到任何地方。

另一件事是关于如何使用map方法的。在这里,我举了一个示例,说明如何使用它来处理您的代码: