반응형
Vuex 작업, vuex 모듈 및 사용자 지정 이름의 mapActions
모든 액션 이름을 입력하지 않고 템플릿 내에서 Vuex 액션을 사용할 수 있는 방법에 대해 고민하고 있습니다.이러한 코드는 다음과 같습니다.
export default new Vuex.Store({ modules: articles, auth, blabla})
my articles.my articles.getters에는 액션, getter 등이 포함되어 있습니다.액션의 1개는 다음과 같습니다.
[ArticleActions.remote.FETCH_ALL]({commit}) {something axios stuff}
true라는 이름으로 내보냅니다.
export const articles = {
namespaced: true,
state: initialState,
mutations,
actions,
getters
};
내 컴포넌트 기사 목록.vue 이 액션을 mapActions와 함께 사용합니다.
methods: {
...mapActions('articles', [ArticleActions.remote.FETCH_ALL])
}
이것은 동작합니다만, DocumentActions.remote 값은 사용하지 않습니다.FETCH_ALL을 템플릿에 포함시키고 싶은 것은 다음과 같습니다.
methods: {
...mapActions('articles', [{fetchAll: ArticleActions.remote.FETCH_ALL}])
}
필요한 것은 다음과 같습니다.
mounted(){fetchAll();}
대신
mounted(){ArticleActions.remote.FETCH_ALL();}
할 수 있을까?
시간이 좀 지나자 스스로 깨달았어요. 사실, 그건 쉬웠어요...
...mapActions('articles', {
fetchAll: ArticleActions.remote.FETCH_ALL,
}
),
대체 구문에 익숙했기 때문에 그대로 두었습니다.
...mapGetters("articles", [
'articles',
])
그래서 []만 사용하려고 했는데 해결 방법은 Objects를 사용하는 것입니다. 도움이 되길 바라며 죄송합니다.이렇게 하면 효과가 있습니다.
mounted(){this.fetchAll();}
언급URL : https://stackoverflow.com/questions/53318668/vuex-actions-vuex-modules-and-mapactions-with-custom-name
반응형
'programing' 카테고리의 다른 글
malloc을 사용할 때마다 경고가 뜨는 이유는 무엇입니까? (0) | 2022.07.28 |
---|---|
다른 vuex 모듈에서 getter에 액세스하는 방법 (0) | 2022.07.28 |
Java에서 컴퓨터의 CPU, 메모리 및 디스크 사용량을 모니터링하려면 어떻게 해야 합니까? (0) | 2022.07.28 |
Vuex 변경은 모듈에 영향을 주지 않음 (0) | 2022.07.27 |
Vuex(vuex-typex)에서 알 수 없는 작업 유형이 갑자기 느려짐 (0) | 2022.07.27 |