반응형
Vue.js[vuex] 변환에서 디스패치하는 방법
json 개체에 적용할 필터 목록이 있습니다.
내 돌연변이는 다음과 같습니다.
const mutations = {
setStars(state, payload) {
state.stars = payload;
this.dispatch('filter');
},
setReviews(state, payload) {
state.reviews = payload;
this.dispatch('filter');
}
};
필터 작동 방식 때문에 사용자가 필터 옵션을 선택 해제하면 문제가 발생하기 때문에 목록을 계속 다운필터링할 수 없기 때문에 필터를 다시 적용해야 합니다.
그래서 별 필터나 리뷰 필터(사용자가 필터링 중)에 변환이 이루어졌을 때 모든 필터를 실행하는 함수를 호출해야 합니다.
여기서 가장 쉬운 선택은 무엇입니까?실제로 결과를 필터링하는 돌연변이를 호출하는 일종의 도우미 기능이나 가능한 동작을 추가할 수 있습니까?
돌연변이는 추가 액션을 디스패치할 수 없지만 액션은 다른 액션을 디스패치할 수 있습니다.따라서 하나의 옵션은 액션에 의해 변환이 커밋되고 필터 액션이 트리거되는 것입니다.
가능한 경우 다른 옵션은 모든 필터에 대해getters
데이터 변경에 대해 계산된 속성처럼 자연스럽게 반응합니다.
다른 액션을 호출하는 액션의 예:
// store.js
export default {
mutations: {
setReviews(state, payload) {
state.reviews = payload
}
}
actions: {
filter() {
// ...
}
setReviews({ dispatch, commit }, payload) {
commit('setReviews', payload)
dispatch('filter');
}
}
}
// Component.vue
import { mapActions } from 'vuex';
export default {
methods: {
...mapActions(['setReviews']),
foo() {
this.setReviews(...)
}
}
}
변환에 의한 액션을 실제로 디스패치하려면this
. 예:
const actions = {
myAction({ dispatch, commit }, { param }) {
// Do stuff in my action
}
}
const mutations = {
myMutation(state, value) {
state.myvalue = value;
this.dispatch('myModule/myAction', { param: 'doSomething' });
},
}
언급URL : https://stackoverflow.com/questions/44309627/vue-jsvuex-how-to-dispatch-from-a-mutation
반응형
'itsource' 카테고리의 다른 글
JSP를 사용하여 URL에서 파라미터를 취득하는 방법 (0) | 2022.09.03 |
---|---|
변수 이름에 댓글을 달 수 있나요? (0) | 2022.09.03 |
C/C++에서 사람들이 하는 부당한 가정을 설명하기 위한 교육 도구에는 무엇이 있습니까? (0) | 2022.08.31 |
CMake에서 컴파일러가 Clang인지 테스트하려면 어떻게 해야 하나요? (0) | 2022.08.31 |
AX 분리 방법Vuex 스토어로부터의 IOS 요구 (0) | 2022.08.31 |