vue.js - Vue.js：如何更新对象数组？

Question

我正在尝试更新 Vue.js 中的对象数组。当尝试更新我的位置的值时，我正在努力更新数组中的对象。

当我注销对象时，我得到了这个：

console.log(this.location) // {…}

console.log(this.location.additionalProperties);  // [{…}, __ob__: Observer]

console.log(this.location.additionalProperties.integrations);  // undefined

我的additionalProperties对象如下所示：

"additionalProperties": [
    {
      "integrations": [
        {
           "foo": {
               "locationId": 123,
               "example": "bar",
               ...
           }
        }
      ]
    }
],

我将我的location作为这样的道具传递：

location: {
    type: Object,
    required: true,
    default: () => ({}),
},

我知道我得到了正确传递的位置。我相信这是我正在努力解决的语法问题。我正在尝试将我的foo对象设置为如下所示：

this.location.additionalProperties.integrations.foo = {
   locationId: 456,
   example: "testing",
   somethingElse: "anotherValue"
}

使用上面的，我会得到一个版本的cannot set foo of undefined. 如何更新additionalProperties数组中的对象？

感谢您的任何建议！

标签： vue.jsvuejs2

Answer 1

AdditionalProperties 是一个数组

"additionalProperties": [
    {
      "integrations": [
        {
           "foo": {
               "locationId": 123,
               "example": "bar",
               ...
           }
        }
      ]
    }
],

this.location.additionalProperties[0].integrations.foo = ...