반응형
Vuex Getter가 업데이트되지 않음
아래 게이터가 있다.
withEarmarks: state => {
var count = 0;
for (let l of state.laptops) {
if (l.earmarks.length > 0) {
count++;
}
}
return count;
}
구성 요소에서 이 계산된 속성은 다음과 같다.
withEarmarks() { return this.$store.getters.withEarmarks; },
반환되는 값은 랩톱 어레이에서 요소를 변경하고 게터가 업데이트되지 않을 때까지 정확하다.
당신의 경우state.laptops.earmarks
배열이며, 배열 색인으로 조작하는 경우state.laptops[index]
. Vue는 상태 배열의 돌연변이에 (색인별로) 반응할 수 없음.이 문서에서는 다음과 같은 2가지 해결 방법을 제공한다.
// 1. use purpose built vue method:
Vue.set(state.laptops, index, laptop)
// 2. splice the value in at an index:
state.laptops.splice(index, 1, laptop)
비록 문서화 되긴 했지만, 그 페이지에 "이걸 모르면 몇 시간의 생산성을 낭비하게 될 거야"라고 쓰여 있는 거대한 네온사인이 좋은 추가가 될 거라고 생각해.
https://vuejs.org/v2/guide/list.html#Caveats에서 이 "contat"에 대해 자세히 알아보십시오.
리액티비티 이슈와 부에 주의사항 외에 또 다른 이유가 있을 수 있다, 현지 변수를 소개해 주셨는데요.counter
계산된 함수에서, 당신은 다음을 사용해 볼 수 있다.reduce
주어진 대로 기능하다
withEarmarks: state => {
return state.laptops.reduce((acc, item) => {
if(item.earmarks.length > 0){
acc++;
}
return acc;
}, 0);
}
이 대답 외에 @jpschroeder의 대답을 고려한다.
참조URL: https://stackoverflow.com/questions/40860592/vuex-getter-not-updating
반응형
'programing' 카테고리의 다른 글
중첩된 v-for의 카운터 증가 (0) | 2022.05.03 |
---|---|
Vue-roouter 2는 경로를 변경하지만 보기를 업데이트하지 않는가? (0) | 2022.05.03 |
Light C 유니코드 라이브러리 (0) | 2022.05.02 |
Vuex 상태에서 Vue 라우터를 사용하는 방법? (0) | 2022.05.02 |
bootstrap-vue: 특정 css 가져오기 (0) | 2022.05.02 |