什么时候使用基础 Vue 实例、Vuex 或 mixin？

Question

在Vue中，你可以在基础Vue实例中存储常用的变量和方法。这样其他组件就可以访问此数据。

new Vue({
    data: {
        name: 'John'
    }
});

如果您使用 Vuex 进行状态管理，您也可以将此数据存储在这里。

const store = new Vuex.Store({
    state: {
       name: 'John'
    }
}

据我了解，Vue mixin 也提供相同的功能（允许任何组件访问全局共享的数据）。

Vue.mixin({
    data() {
        return {
            name: 'John'
        };
    }
});

我的问题是什么时候应该在 Vuex 或全局混合中使用基础 Vue 实例？

Answer 1

Vuex 是一个非常复杂的状态管理解决方案，可以像 Unidirectional/one-way 数据流架构一样迎合 Redux。当您需要以一种复杂的方式跨组件共享数据时使用它，您还需要处理副作用。您也可以说 Vuex 只不过是 Vue 实例的美化实现。

Vue 实例，a.k.a.，Vue 组件旨在为您的 UI 组件建模。是的，它也可以作为状态管理器和全局事件总线。但仅将其用于较小的应用程序和 POC。否则，Vuex 永远是正确的选择。

现在说Mixins。它并不是真正的状态管理机制。它旨在跨不同组件共享可重用的功能。通常使用 mixin 来只有 data() 并不是一个好的设计。它还必须有一些方法可以作用于该数据。这就是 mixins 适合整个 Vue 生态系统的地方。

When to use the base Vue instance, Vuex or mixin?