programing

Vue 구성 요소 vuex 저장소 상태 속성이 이미 데이터로 채워졌는지 확인합니다.

copyandpastes 2022. 7. 3. 18:39
반응형

Vue 구성 요소 vuex 저장소 상태 속성이 이미 데이터로 채워졌는지 확인합니다.

여기 제 설정이 있습니다.상태의 "카테고리" 상태는 json 끝점에서 비동기식으로 가져옵니다.

컴포넌트에서 이 데이터로 작업하고 싶은데 페이지를 새로고침하면 카테고리가 항상 비어 있습니다.

methods: {
        onSubmit() {
            console.log(this.filter);
        },
        formCats(items) {
            console.log(items);
            // const arr = flatten(data);
            // console.log(arr);
        }
    },
    created() {
        const data = this.categories;

        this.formCats(data);
    },
    computed: {
        ...mapState(['categories'])
    }

wait this.categories에서 async created()도 시도했습니다.또한 예상대로 작동하지 않습니다!누가 좀 도와줬으면 좋겠어요.감사합니다!

이 문제는 컴포넌트가 이미 로드될 때까지 비동기 페치가 완료되지 않기 때문에 발생합니다.이 문제를 해결하는 방법은 여러 가지가 있습니다.제거한다.created그리고 돌린다formCats으로 나누다.computed.

computed: {
  ...mapState(['categories']),
  formCats() {
    let formCats = [];
    if (this.categories && this.categories.length) {
      formCats = flatten(this.categories);
    }
    return formCats;
  }
}

formCats처음에 빈 배열이 되고, 그 후 즉시 포맷된 카테고리가 됩니다.this.categories취득이 완료되었습니다.

언급URL : https://stackoverflow.com/questions/60809717/vue-component-check-if-a-vuex-store-state-property-is-already-filled-with-data

반응형