在 Vue vs state 中创建全局变量答案

【问题标题】：Creating global variables in Vue vs state在 Vue vs state 中创建全局变量
【发布时间】：2018-07-20 13:00:40
【问题描述】：

在 Vue 中创建全局变量的最佳方法是什么？是用Vuex吗？

我可以像这样访问 Vuex 状态：

{{ store.$state.myvar }}

这有点乱。我宁愿这样做：

{{ myvar }}

这可能吗？

【问题讨论】：

标签： vue.js vuejs2 global-variables vuex

【解决方案1】：

在组件中添加计算属性：

computed: {
   myVar: {
      get() { return this.$store.state.myVar; },
      set(value) { this.$store.commit('updateMyVar', value); }
   },
}

这使您可以像使用组件中的任何其他属性一样使用它。

【讨论】：

【解决方案2】：

你可以做任何你想做的事。您应该尝试并组织您的状态，以便“有一个一个适合所有事物的地方，并且一切都在它的位置”。

当然你可以在 Vue 中创建和引用全局变量。比如说，你可以使用var myVar = store.$state.myvar，并且你在 Vuex 中为你的 var 提供了一个全局别名。但是，大但是，如果你选择使用 Vuex，那么你需要坚持这个选择。在全局状态下创建别名将很快导致冲突和混乱。 Vue 是模糊的 MVVM，灵感来自 Elm。它希望您将状态与界面组件分开。这可能导致引用状态项的路径变长，但回报是值得的——你不需要在所有地方同步和共享一点点状态。这能回答问题吗？

【讨论】：

谢谢。我认为最终我的商店变得太大了，所以需要寻找解决方法，比如medium.com/3yourmind/…