반응형
약속의 이유내 vuex 스토어에서는 모든 것이 작동하지 않는다.
난 지금 이상한 문제에 직면해 있어.나의 vue 프로젝트에는 다른 모듈로 분리된 vuex 스토어가 있습니다.사용하고 싶다Promise.all()
두 개의 독립된 비동기 vuex 액션을 동시에 실행하여 첫 번째 장애 동작의 이점을 누릴 수 있습니다.
스토어/스토어/카테고리:
async CATEGORIES({ rootState }) {
const response = await axios.post('link_to_api', {
// some arguments for the api
arg: rootState.args
})
return response
}
스토어/매장/정보:
async TRANSPORTATION({ rootState }) {
const response = await axios.post('link_to_api', {
// some arguments for the api
arg: rootState.args
})
return response
}
이러한 비동기 함수를 호출하고 싶은 것을 알고 있습니다.Promise.all
:
스토어/스토어/카테고리:
async PUT_CATEGORIES({ commit, dispatch, rootState }) {
try {
const [resCategories, resTransportation] = await Promise.all([
dispatch('CATEGORIES').catch(err => { console.log('Fehler bei Kabinenabfrage!'); throw {error: err, origin: 'kabine'}; }),
dispatch('transportation/TRANSPORTATION', {root:true}).catch(err => { console.log('Fehler bei Flugabfrage!'); throw {error: err, origin: 'flug'}; })
])
//do something after both promises resolved
} catch(error) {
// do something if one promise rejected
commit('errorlog/ERROR', 4, {root:true})
dispatch("errorlog/LOG_ERROR", {'origin': '2', 'error_code': '113', 'message': error.toString()}, {root:true})
router.push({path: '/Error'})
}
다음의 에러가 표시됩니다.
이거 이상한데, 왜냐하면 나는{root:true}
및 프리픽스 트랜스포트를 디스패치하여 저장 중인 트랜스포트 모듈의 액션에 액세스합니다.이것은 catch 블록에서 사용하는errorlog 모듈의 LOG_ERROR 액션에 매우 적합합니다.
범주 모듈에서 Transportation 액션을 복사하면 정상적으로 작동합니다.
이 문제에 직면한 적이 있고 조언이 있는 사람이 있습니까?
잘 부탁드립니다!
당신의 경우,{root:true}
두 번째 인수로 전달되지만 세 번째 인수로 전달되어야 합니다.
- dispatch('transportation/TRANSPORTATION', {root:true})
+ dispatch('transportation/TRANSPORTATION', null, {root:true})
vuex의 문서에 따르면
글로벌 네임스페이스에서 작업을 디스패치하거나 돌연변이를 커밋하려면 디스패치 및 커밋할 세 번째 인수로 {root: true}을(를) 전달하십시오.
또한 샘플 코드도 제공합니다(여기서 더 간략하게 설명).
modules: {
foo: {
namespaced: true,
actions: {
// dispatch and commit are also localized for this module
// they will accept `root` option for the root dispatch/commit
someAction ({ dispatch, commit, getters, rootGetters }) {
dispatch('someOtherAction') // -> 'foo/someOtherAction'
dispatch('someOtherAction', null, { root: true }) // -> 'someOtherAction'
언급URL : https://stackoverflow.com/questions/60147057/why-does-promises-all-doesnt-work-in-my-vuex-store
반응형
'programing' 카테고리의 다른 글
컴파일 시 sizeof() 결과를 C로 출력하려면 어떻게 해야 하나요? (0) | 2022.07.02 |
---|---|
처리되지 않은 약속 거부 구문 오류 Internet Explorer (0) | 2022.07.02 |
Vuetify 컴포넌트의 소품을 글로벌하게 설정(내 경우는 'v-data-table') (0) | 2022.07.02 |
.addEventListener 내의 Vue.protype에 액세스하는 방법 (0) | 2022.07.02 |
Vue 2 - Ajax 응답에서 컴포넌트를 렌더링합니다. (0) | 2022.07.02 |