Javascript 在vue js中解析承诺时组合两个数组

我在这个变量

this.roomsData.rooms\u photos

[ { "url": "https://api.example.com/uploads/609ee58907166.jpg" }, { "url": "https://api.example.com/uploads/609ee5898ba19.jpg" }, { "url": "https://api.example.com/uploads/609ee58994a10.jpg" }, { "url": "https://api.example.com/uploads/609ee589af635.jpg" }, { "url": "https://api.example.com/uploads/609ee589b0fc7.jpg" }, { "url": "https://api.example.com/uploads/609ee589cd79f.jpg" }, { "url": "https://api.example.com/uploads/609ee589d8d27.jpg" } ]

这个数据呢

[ { "url": "https://api.example.com/uploads/609eeded64530.jpg" }, { "url": "https://api.example.com/uploads/609eeded68ebe.jpg" }, { "url": "https://api.example.com/uploads/609eeded6a6bc.jpg" } ]

我在这个变量

中有this.roomsData.edit\u room\u photos

，它是从

uploadRoomImages: async function (file, progress, error, options) {
    try {
        console.log(file, options);
        const formData = new FormData()
        formData.append('room_photos', file)
        const result = await fetch('https://api.example.com/uploads_scripts/rooms.php', {
            method: 'POST',
            body: formData
        })
        progress(100) // (native fetch doesn’t support progress updates)
        return await result.json()
    } catch (err) {
        error('Unable to upload file')
    }

},

这是组件

<FormulateInput
          type="image"
          name="room_photos"
          v-model="roomsData.edit_room_photos"
          label="Select Room Images To Upload"
          help="Select a png, jpg,webp or gif to upload."
          validation="required|mime:image/jpeg,image/png,image/gif,image/webp"
          :uploader="uploadRoomImages"
          error-behavior="live"
          multiple
/>

由于此变量

this.roomsData.room\u photos

中已有数据，如何将数据添加到此变量

this.roomsData.room\u photos

从等待函数解析和存储数据中获取的数据

this.roomsData.edit\u room\u photos

[ { "url": "https://api.example.com/uploads/609ee58907166.jpg" }, { "url": "https://api.example.com/uploads/609ee5898ba19.jpg" }, { "url": "https://api.example.com/uploads/609ee58994a10.jpg" }, { "url": "https://api.example.com/uploads/609ee589af635.jpg" }, { "url": "https://api.example.com/uploads/609ee589b0fc7.jpg" }, { "url": "https://api.example.com/uploads/609ee589cd79f.jpg" }, { "url": "https://api.example.com/uploads/609ee589d8d27.jpg" } ]

我在表单提交处理程序上尝试了对象分配和数组concat，但这会导致循环json错误

---

我希望在不删除重复项的情况下将两个数组中的数据一起添加。如何在不删除重复项的情况下将两个数组组合在一起。

您可以将计算值与setter一起使用：

computed: {
  room_photos: {
    get: function () {
      return [...this.roomsData.room_photos, ...this.roomsData.edit_room_photos];
    },
    set: function (newValue) {
      this.roomsData.edit_room_photos = newValue.slice(this.roomsData.room_photos.length);
    },
  },
},

---

如果

uploadRoomImages（）

uploadRoomImages:async函数（文件、进度、错误、选项）{
试一试{
//...
const result=await result.json（）
返回result.concat（this.roomsData.roomu照片）
}捕捉（错误）{
错误（'无法上载文件'）
}
},

---

注意

Array.prototype.concat（）

不过滤重复项，因此在这种情况下不必担心丢失重复项。

您能举一个简单的例子，输入，预期输出？您可以在此处查看官方文档不理解您的问题使其更简单在循环JSON结构上调用

JSON.stringify（）

时发生，并且不是

Object.assign

或

Array.concat

的直接原因。