vuex 모듈 내에서 작업/변화를 청취합니다.

vuex 모듈 내에서 작업/변화를 청취합니다.

여러 모듈이 있는 vuex 스토어가 있는데 "global"을 듣고 싶다.dispatch또는commit콜(액션 및 돌연변이)을 모듈 내에서 실행합니다.예를 들면,authmodule 로그인 및 로그아웃 등의 액션이 있습니다.이러한 액션이 디스패치 될 때마다 다른 모듈을 원합니다.ui로그인한 사용자를 기반으로 언어를 설정하는 등의 작업을 수행합니다.

내가 그냥 보낼 수 있다는 걸 알아ui의 로그인 및 로그아웃 작업 내에서의 작업auth모듈.하지만 그 반대로 하는 게 낫겠어요ui에서 송신된 이벤트(액션 및/또는 돌연변이)를 듣고 있습니다.auth이렇게 하면 "오리지널" vuex 모듈을 변경하지 않고도 쉽게 부작용을 만들 수 있습니다.

시계를 사용해야 할지도 모르지만, 어떤 행동은 상태를 바꾸지 않기 때문에 항상 시계를 사용할 수는 없습니다.플러그인 작성도 옵션이지만 이러한 부작용을 만들고 싶을 때마다 추가 플러그인을 만들고 싶지 않습니다.

그래서 질문입니다. vuex 모듈 내에서 다른 모듈에서 디스패치된 액션/변환을 청취하려면 어떻게 해야 합니까?

모든 저장소의 모든 새로 고침 작업을 트리거할 수 있는 vuex 플러그인을 직접 만들었습니다.하지만 내가 새로 고친 곳에서 다른 건 다 할 수 있어

플러그인:

const onModuleAValueChange= (store) => {
    store.watch(
        state => state.moduleA.value,
        (val, oldVal) => {
            // Don't do anything on init state
            if (!oldVal) return;

            // This will trigger all refresh actions on all store. But you can add anything here
            // Essentially does: 
            // store.dispatch(`moduleA/refresh`); 
            // store.dispatch(`moduleB/refresh`); 
            // store.dispatch(`moduleC/refresh`);
            for (let state in store.state) {
                const action = `${state}/refresh`;
                // If the store does not have an refresh action ignore
                if (store._actions[action]) store.dispatch(`${state}/refresh`);
            }

            // Additional action 
            store.dispatch(`moduleC/moduleC_Action`);
        }
    );
};

코어 저장:

export const store = new Vuex.Store({
    modules: {
        moduleA,
        moduleB,
        moduleC
    },
    plugins: [onModuleAValueChange]
});

언급URL : https://stackoverflow.com/questions/53269187/listen-to-actions-mutations-from-within-a-vuex-modules