Javascript 不改变道具的双循环，VUE3

我有一个“数据”道具，上面写着：

data = [
    {
      "label":"gender",
      "options":[
        {"text":"m","value":0},
        {"text":"f","value":1},
        {"text":"x", "value":null}
      ]
    },
    {
      "label":"age",
      "options":[
        {"text":"<30", "value":0},
        {"text":"<50","value":1},
        {"text":">50","value":3}
      ]
    }
  ]

data.forEach(item => {
    item.options.forEach(option => {
      if (option.value !== null && option.value !== 0) {
        option.value *= 2;
      }
    })
  });

现在我尝试在一个computed属性中使用.map（）来实现这一点，这样它就不会改变我的数据道具，但我不知道如何实现

computed: {
  doubledValues() {
    var array = this.data.map((item) => {
      //...
      item.options.map((option) => {
        //... option.value * 2;
      });
    });
    return array;
  }
}

---

只需复制对象/数组。会是这样的

computed: {
  doubledValues() {
    return this.data.map((item) => {
      const resultItem = {...item};
      resultItem.options = item.options.map((option) => {
        const copyOption = {...option};
        if (copyOption.value !== null && copyOption.value !== 0) {
          copyOption.value *= 2;
        }
        return copyOption;
      });
      return resultItem;
    });
  }
}

您可以使用

map（）

方法，如下所示：

计算：{
双值（）{
返回this.data.map（item=>（{…item，options:item.options.map（obj=>{
返回（obj.value！=null）？{…obj，value:obj.value*2}:{…obj}
})})
);
}
}