반응형
vuex 작업 개체 내부에 비동기 코드를 작성하는 방법은 무엇입니까?
제 vue.js 앱에 Restapi가 있는데 vuex를 사용하여 비동기 코드를 작성하는 다른 방법이 있는지 알고 싶습니다.
내 코드는 이렇게 생겼습니다.
//store.js
const actions = {
async GET_CLAN_MEMBERS({commit},id){
let token = users.getters.getToken;
return await axios.post(config.api + 'clans/' + id,{token})
}
};
//Component.vue
created (){
this.$store.dispatch('GET_CLAN_MEMBERS',this.$route.params.id).then((res) =>
{
this.members = res.data;
})
},
지금은 작동하고 있지만, 여기가 가장 좋은 장소인지, 아니면 store.js 파일 안에 쓰는 연습인지 모르겠습니다.
잘 부탁드립니다.
표준 관행: 액션은 항상 세터로 사용되므로 api 콜백 응답 후에는 응답 데이터를 기반으로 상태를 변경하기 위해 변환을 호출하고 getter로 사용되는 getter를 호출해야 합니다(상태 데이터 검색).
따라서 표준 실행을 위해 아래 흐름도를 따라야 합니다.
자세한 내용은 여기를 참조하십시오.
저도요, 이 질문을 머리 위에 받았고 실제로 가게는 그들의 행동 안에 있는 레스트 api를 소비할 수 있습니다.
이것이 vuex가 너무 큰 저장 파일을 피하기 위해 모듈을 지원하는 이유입니다.
여기서 몇 가지 실험을 수행했습니다(모듈화를 생략했지만 좋은 예로 작동함). 공식 문서 자체에는 비동기 작업을 작업 내부에 호출하도록 나와 있습니다.따라서 내부 동작에 대한 axios/rest가 권장되는 방법입니다.
언급URL : https://stackoverflow.com/questions/54618369/how-to-write-async-code-inside-vuex-action-object
반응형
'programing' 카테고리의 다른 글
Scipy(Python)로 이론적인 분포에 경험적 분포를 맞추는 것? (0) | 2023.06.10 |
---|---|
루비에서 긴 반복 텍스트 문자열을 생성하려면 어떻게 해야 합니까? (0) | 2023.06.10 |
mysql 콘솔에서 mysql.user 테이블에 삽입할 때 "not insertable-to" 오류가 발생하는 이유는 무엇입니까? (0) | 2023.06.10 |
Axios 약속이 vue 메서드에서 오류를 발생시키지 않습니다. (0) | 2023.06.10 |
여러 열을 기준으로 데이터 프레임 행 정렬(순서 정렬) (0) | 2023.06.10 |