Vue.js 對新 object 的反應性

Question

我正在嘗試使 object 對 Vue.js 具有反應性（“數據”中不存在，因此默認情況下沒有反應性）。

我使用 Vue.set 遇到了本指南，但是...如何設置一個空的 object 反應式？

舉例說明：

let app = new Vue({
  el: "#app",

  data: {
    items: [],
  },

methods: {
    setItems: function () {
        this.items[0] = {}; //how to make this reactive?
        Vue.set(this.items[0], 'name', newValue); //newValue should be updated every hour form API response
}

“newValue”永遠不會更新，因為“數據”中不存在“{}”，但我不知道在這種情況下如何使用 Vue.set。

關於如何在不添加以下代碼的情況下解決它的任何想法？

data: {
    items: [{}],
  },

非常感謝！

Answer 1

下面的方法怎么樣？

setItems: function () {
    Vue.set(this.items, 0, { 'name': newValue })
}

示例： https://jsfiddle.net/7mejxybg/3/