如何在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推荐课程！