VueJS没有在for循环内渲染数据集

Question

我对 VueJS 很陌生，所以请多多包涵。 我将尝试尽可能详细地解释。

所以我正在创建一个 Vue 应用程序，它将简单地从服务器获取响应，遍历数据并将变量（Vue 数据）设置为值。

但是，当我在 for 循环中循环数据时，我可以访问和更改 Vue 数据，但它不会被渲染。 请参阅下文了解我更详细的意思

我的Vue应用程序：

var app = new Vue({
    el: '#app',
    data() {
        return {
            items: {}
        }
  },
    mounted() {
        //using Axios to post -> this all works
        axios({
          method: 'post',
          url: 'fetchOrder.php'
          //used both arrow and normal function still doesn't work
        }).then((response) => {
            response = Object.entries(response.data)
            for (i = 0; i < response.length; i++) {
              //values are all correct
              this.items[response[i][0]] = response[i][1]
            }
        })
    }
})

我一直在四处寻找，我可以将 this.items 设置为 for 循环外的响应值。 但是，一旦我将任何内容放入 for 循环中，则由于停止渲染列表（我只是使用一直在工作的 v-for="order in order" 在提示中渲染）。

另一件非常奇怪的事情是，我正在使用 Vue 扩展，并且订单 object 具有所有正确的值，因此它正在被设置，只是列表不是由 VueJS 呈现的。 （请参阅下面我的 vue 插件响应）

Vue 插件数据 output - image

所以我能想到的只是 scope 的问题，我不能使用它。 ? 我已经尝试过诸如 .bind(this) 之类的东西，但这也没有用。

谢谢你的时间：）

注意：我不确定这是否重要，但我通过 CDN 包含 Vue 而不是实际的 package

注意：错字只是堆栈溢出，并没有解决我的错误

Answer 1

更新：使用 this.$set(this.items, response[i][0], response[I][1]) 解决了我的问题。

感谢@Hismanshu 的回答