Что происходит под капотом Vuex и будут ли некоторые модификации нарушать основные функции? - PullRequest
Новая
       10

Что происходит под капотом Vuex и будут ли некоторые модификации нарушать основные функции?

0 голосов
/ 28 января 2019

В настоящее время я использую Vue + Typescript + Vuex, использую декораторы из vuex-class в моих компонентах Vue и организовываю свои файлы для каждого модуля магазина следующим образом: 

moduleA-store.ts   // state
moduleA-actions.ts
moduleA-mutations.ts
moduleA-getters.ts

Что мне не нравитсяо том, что настройка Vuex по умолчанию - это негибкость, такая как невозможность получить доступ к действию из модуля B внутри действия модуля A.

например, получение изображения профиля в действии регистрации моего магазина "auth"модуль, URL которого должен быть записан в моем профиле пользователя, обработанный действием моего «пользовательского» модуля хранения

Насколько я знаю, с настройкой по умолчанию нет способа достичь следующего;единственное, к чему я могу получить доступ из любого места, это состояние различных модулей.

Это заставило меня задуматься о небольших изменениях, чтобы преодолеть это путем замены текущей настройки, которая выглядит примерно так:

auth-actions.ts

export const actions: ActionTree<AuthState, RootState> = { 
    signInWithGoogle({ commit }, payload) {
        // ...
        commit('setWhatever', whatever)
    }
}

auth-mutations.ts

export const mutations: MutationTree<AuthState> = {
    setWhatever(state, whatever) {
        state.whatever = whatever
    }
}

с помощью более чистых, настраиваемых (и безопасных) настроек , таких как следующие

auth-actions.ts

import authMutations from 'auth-mutations.ts'
import userActions from 'user-actions.ts'

export const authActions = {
    async signInWithGoogle(payload) {
        // ...
        authMutations.setWhatever(whatever)
        userActions.setProfileURL(url)
    }
}

auth-mutations.ts

import authState from 'auth-store.ts'

export const authMutations = {
    setWhatever(whatever: string) {
        authState.whatever = whatever
    } 
}

user-actions.ts

export const userActions = {
    setProfileURL(url: string) {
        // ...
    } 
}

Что меня больше всего интересует сейчас, так это

  1. Плюсы и минусыэтот подход / разумные альтернативы?
  2. Это нарушает некоторые основные функциональные возможности Vuex?
  3. Есть ли даже некоторые функциональные возможности под капотом Vuex, которые могут быть нарушены, как некоторые механизмы оптимизации / кэширования (по крайней мере,на стороне геттера)?
...