programing

VueJ, Vuex, Getter가 빈 어레이로 표시되지만 console.log에 모든 값이 포함된 개체로 표시됨

itsource 2022. 8. 3. 00:30
반응형

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

반응형