VueJ, Vuex, Getter가 빈 어레이로 표시되지만 console.log에 모든 값이 포함된 개체로 표시됨
이게 제가 사용하는 방법입니다. 꽤 간단합니다.
DailyCountTest: function (){
this.$store.dispatch("DailyCountAction")
let NewPatientTest = this.$store.getters.NewPatientCountGET
console.log(NewPatientTest)
}
getter는 django 백엔드 API를 호출하는 단순한 액션에서 데이터를 가져옵니다.
데이터로 차트를 작성하려고 하는데 변수에 할당해야 해요.유일한 문제는 변수에 접근할 수 없다는 거예요.
내용물은 볼 수 있지만 빈 괄호도 볼 수 있습니다.내가 어떻게 그 가치들에 접근할 수 있는지 아는 사람?지도를 많이 써봤어요.(객체) 예시로 아무런 성과를 거두지 못했습니다.
이 어레이를 조작해 컨텐츠를 취득하는 방법에 대해 추천할 만한 것이 있습니까?
감사합니다!
API 데이터의 Vuex 경로는 다음과 같습니다.
액션:
DailyCountAction ({ commit }) {
axios({
method: "get",
url: "http://127.0.0.1:8000/MonthlyCountByDay/",
auth: {
username: "test",
password: "test"
}
}).then(response => {
commit('DailyCountMutation', response.data)
})
},
변환:
DailyCountMutation(state, DailyCount) {
const NewPatientMap = new Map(Object.entries(DailyCount));
NewPatientMap.forEach((value, key) => {
var NewPatientCycle = value['Current_Cycle_Date']
state.DailyCount.push(NewPatientCycle)
});
}
게터:
NewPatientCountGET : state => {
return state.DailyCount
}
상태:
DailyCount: []
당신의 문제에 대한 특별한 설명이 눈에 띄었습니다.
getter는 django 백엔드 API를 호출하는 단순한 액션에서 데이터를 가져옵니다.
그것은 비동기적인 행동을 의미하며, 당신은 인종적 조건을 얻을 수 있습니다.제 의심을 확인하기 위해 getter 기능의 샘플을 올려주실 수 있나요?
getter가 실제로 그 내용을 입력하기 위해 행동에 의존하고 있다면, 다음과 같은 효과의 무엇인가가 필요할 수 있습니다.
DailyCountTest: async () => {
await this.$store.dispatch('DailyCountAction')
await this.$store.dispatch('ActionThatPopulatesNewPatientCount')
let NewPatientTest = this.$store.getters.NewPatientCountGET
// ... do whatever with resulting array
}
시스템 속성을 사용하여 시도할 수도 있습니다.Import 할 수 있습니다.mapGetters
import { mapGetters } from 'vuex'
이후 계산된 속성:
computed: {
...mapGetters(['NewPatientCountGET'])
}
그 후, 사용하실 수 있습니다.NewPatientCountGET
스토어에서 값이 변경될 때마다 업데이트됩니다.(예를 들어 api가 새 값을 반환하는 경우)
그게 말이 됐으면 좋겠어
언급URL : https://stackoverflow.com/questions/54949878/vuejs-vuex-getter-is-showing-as-an-empty-array-but-console-log-shows-its-an
'programing' 카테고리의 다른 글
Vuejs: 섀도우 루트가 아닌 헤드에 CSS가 로드됩니다. (0) | 2022.08.03 |
---|---|
Vuex 저장소의 두 상태 병합 (0) | 2022.08.03 |
자체 API에서 Nuxt Js로 콘텐츠를 프리렌더하는 방법 (0) | 2022.08.03 |
socket connect() vs bind() (0) | 2022.08.03 |
이클립스:현재 선택한 메서드/표현의 하이라이트 색상을 변경하려면 어떻게 해야 합니까? (0) | 2022.08.03 |