Vue.js:如何更新对象数组? [英] Vue.js: How can I update an array of objects?

问题描述

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

I am trying to update an array of objects in Vue.js. When trying to update the values of my location I am struggling to update the objects within an array.

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

When I log the objects out, I get this:

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

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

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

我的 additionalProperties 对象如下所示:

My additionalProperties object looks like this:

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

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

I am passing in my location as a props like this:

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

我知道我正确地传递了位置.我相信这是我正在努力解决的语法问题.我试图将我的 foo 对象设置为这样的:

I know I am getting the location passed in correctly. I believe it is a syntax issue I am struggling with. I am trying to set my foo object to be something like this:

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

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

Using the above, I'll get a version of cannot set foo of undefined. How can I update the object within the additionalProperties array?

感谢您的任何建议！

推荐答案

additionalProperties 是一个数组

additionalProperties is an array

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

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

这篇关于Vue.js:如何更新对象数组?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！