何时使用基本Vue实例,Vuex或mixin?

时间:2019-01-07 04:17:58

标签: javascript vue.js vuex

在Vue中,您可以将常用的变量和方法存储在基本Vue实例中。这样,其他组件可以访问此数据。

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

如果您正在使用Vuex进行状态管理,您也可以在此存储这些数据。

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

根据我的理解,Vue mixins还提供相同的功能(允许任何组件全局访问此共享数据)。

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

我的问题是,何时应该在Vuex或全局mixin上使用基本Vue实例?

1 个答案:

答案 0 :(得分:3)

Vuex是一种非常复杂的状态管理解决方案,可像Unidirectional/one-way数据流体系结构那样满足Redux的需求。当您需要以复杂的方式在各个组件之间共享数据并且还需要处理副作用时,可以使用它。您还可以说Vuex只是Vue实例的荣耀实现。

Vue实例(又称Vue组件)用于为您的UI组件建模。是的,它还可以充当状态管理器和全局事件总线。但是,仅将其用于较小的应用程序和POC。否则,Vuex永远是正确的选择。

现在谈论Mixins。它实际上不是状态管理机制。它旨在在不同组件之间共享可重用功能。通常,使用mixin仅具有data()并不是一个好的设计。它还必须具有一些可对该数据起作用的方法。这就是mixins适合整个Vue生态系统的地方。