Когда использовать базовый экземпляр Vue, Vuex или mixin?

Question

В Vue вы можете хранить часто используемые переменные и методы в базовом экземпляре Vue. Таким образом, другие компоненты могут получить доступ к этим данным.

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

Если вы используете Vuex для управления состоянием, вы также можете хранить эти данные и здесь.

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

Насколько я понимаю, микшеры Vue также предлагают такую ​​же функциональность (позволяя любому компоненту получать доступ к этим общедоступным данным по всему миру).

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

Мой вопрос: когда вы должны использовать базовый экземпляр Vue поверх Vuex или глобальный миксин?

Answer 1

Vuex - это очень сложное решение для управления состоянием, предназначенное для Redux, такое как Unidirectional/one-way архитектура потока данных. Используйте его, когда вам нужно обмениваться данными между компонентами сложным способом, где вам также нужно обрабатывать побочные эффекты. Вы также можете сказать, что Vuex - это не что иное, как прославленная реализация Vue instance.

Экземпляр Vue, a.k.a., компонент Vue предназначен для моделирования вашего компонента пользовательского интерфейса. Да, он также может выполнять функции диспетчера состояний и глобальной шины событий. Но используйте его только для небольших приложений и POC. В противном случае Vuex всегда является правильным выбором.

Теперь говорим о Mixins. Это не совсем механизм государственного управления. Он предназначен для обмена функциональностью многократного использования между различными компонентами. Обычно использование миксинов с data() не очень хороший дизайн. Он также должен иметь несколько методов, которые должны воздействовать на эти данные. Вот где миксины вписываются в общую экосистему Vue.