source

getter 함수 내에서 vuex 액션을 디스패치할 수 있습니까?

goodcode 2022. 8. 12. 23:20
반응형

getter 함수 내에서 vuex 액션을 디스패치할 수 있습니까?

getter 함수 내에서 액션을 디스패치하고 싶다.
1. 그것이 가능하고 옳은가?
2. 그렇다면 어떻게 해야 하나요?

이 디스패치('GET_B')가 될 것 같습니다.OK';

const getters = {
    getAllBooksDispatch: (state, getters, dispatch) => {
        if (state.books === null) {
            dispatch('GET_BOOKS');
        }
        return state.books
    },
};

하지만 그것은 효과가 없다.
그래서 제 스토어 파일은 이렇게 생겼습니다.

const initialState = {
    books: null
};

const getters = {
    getAllBooksDispatch: (state, getters, dispatch) => {
        if (state.books === null) {
            dispatch('GET_BOOKS');
        }
        return state.books
    },
};

const mutations = {
    SET_BOOKS: (state,{data}) => {
        console.log('SET_BOOKS mutations')
        state.books = data;
    },
};

const actions = {
    GET_BOOKS: async ({ commit }) => {
        let token = users.getters.getToken;

        let query = new Promise((resolve, reject) => {
            axios.get(config.api + 'books', {token}).then(({data}) => {
                if (data) {
                    commit('SET_BOOKS', {data: data})
                    resolve()
                } else {
                    reject(data.message);
                }
            }).catch(() => {
                reject('Error sending request to server!');
            })
        })

    },
};

아니, 그럴 수 없다.적어도 네가 원하는 방식은 아니야.getter의 세 번째 인수는rootState모듈 사용 시 객체, 사용 안 함dispatchgetter 내에서 액션을 디스패치하는 방법을 찾아도 예상대로 동작하지 않습니다.getters는 동기화되어야 하지만 액션은 비동기일 수 있습니다(이 예에서는 비동기일 수도 있습니다.이 예에서는GET_BOOKS발송되지만 getter는 여전히 반환됩니다.state.books무효로 합니다.

Vuex 스토어 밖에서 이런 종류의 게으른 로딩에 대처할 것을 권장합니다.

언급URL : https://stackoverflow.com/questions/54732007/can-i-dispatch-vuex-action-inside-getter-function

반응형