全局实例属性更改时 Vue 不更新

Question

我的 app.js 中有以下代码（在导入 Vue 之后 new Vue() 之前）：

Vue.prototype.$globalArray = [];

在我的一个 Vue 组件中，我有以下内容：

<span v-for="item in $globalArray">{{ item }}</span>

然后的问题是，当我在我的 Chrome 开发工具中执行 $vm0.$globalArray.push('some text'); 时（使用 Vue 扩展，因此 $vm0），没有任何反应。但是，当我将 app.js 更改为

Vue.prototype.$globalArray = 'some other text';

它确实显示了 'some other text' 所以看起来它只呈现初始值但不更新。当我在组件安装后设置几秒钟的超时然后在 $globalArray.

中插入一些内容时也是如此

有人能告诉我是我做错了什么还是不受支持？

提前致谢

Answer 1

您只定义了一个全局 vue 实例，默认情况下它不是反应式的 - https://vuejs.org/v2/cookbook/adding-instance-properties.html

要使其具有反应性，您可以按照 Vue.observable 例如 - https://vuejs.org/v2/api/#Vue-observable

Vue.prototype.$global = Vue.observable({array: []})

Vue doesn't update when global instance property changes