如何覆盖 vue.js 中的全局变量？

Question

首先，听起来这种情况非常适合使用eventBus ，但我只是在试验。 我觉得这将构成发射和捕获事件的过程。

说在我的 main.js 中我已经声明：

Vue.prototype.$someHeight = 200

在我的一些组件中，我尝试将其更改为：

this.$someHeight = 300

但是当我在我的 vue 中使用它时，它仍然说： {{ $someHeight }} // 输出：200，我期待 300

那么，如何覆盖它呢？ 这是一个好习惯吗？

Answer 1

每个 Vue 组件都是 Vue 的一个实例。 当您在 Vue 的原型上定义一个变量（例如 $someHeight）时，所有创建的新组件都将获得自己的该变量的副本。

这意味着每个 Vue 组件都将拥有自己的 $someHeight 副本，其值为 200。现在，即使您将其值设置为 300，所有其他组件也将具有旧值 200。

这不是一个好习惯。 您应该只在原型上定义函数： Vue doc

现在您可以为此使用 Vuex 或创建一个全局 vue 实例并使用它来存储您的全局变量。 当然推荐 Vuex！