Vuex Store Object Child가 정의되지 않은 상태로 반환되고 상위 항목이 올바르게 반환됩니다. 이유가 무엇입니까?

Vuex Store Object Child가 정의되지 않은 상태로 반환되고 상위 항목이 올바르게 반환됩니다. 이유가 무엇입니까?

비슷한 질문을 몇 번 봤지만 제 상황과 맞지 않는 것 같아요.

로그인을 할 때this.$store.state.account예상한 결과를 얻다

    {__ob__: Nt}
       user: Object
          favorites_playlist: (...)
          firebaseID: (...)
          spotifyID: (...)

하지만 제가console.log(this.$store.state.account.user)사용자 개체가 사라집니다!내부에 중첩된 모든 속성user위에 완벽하게 기록되지만 반환이 정의되지 않음

console.log(this.$store.state.account.user)

{__ob__: Nt}
   __ob__: Nt {value: {…}, dep: vt, vmCount: 0}
   __proto__: Object

이것은 내 컴포넌트 내부의 메서드로 오브젝트를 호출합니다.

        async connectToSpotify() {
            console.log("User Profile: ", this.user)
            var firebaseID = await this.$store.dispatch("signInToFirebase")
  
            var authID = await this.$store.dispatch('connectToSpotify')
            Vue.set(this.$store.state.spotify, "authId", authID)

            var userProfile = await this.$store.dispatch("fetchUserDataFromSpotify", authID)
            userProfile["firebaseID"] = firebaseID

    
            this.$store.dispatch("bindCurrentUser", userProfile.spotifyID)

            console.log("this.$store.state")
            console.log(this.$store.state);
            console.log("this.$store.state.account")
            console.log(this.$store.state.account);
            console.log("this.$store.state.account.user")
            console.log(this.$store.state.account.user);
            console.log("this.$store.state.account.user.favorites_playlist")
            console.log(this.$store.state.account.user.favorites_playlist);
            // console.log(this.$store.state.account.user.firebaseID);
             var favorites_playlist = this.$store.state.account.user.favorites_playlist


            var playlistID = await this.$store.dispatch("createFavoritesPlaylist", [authID, userProfile.spotifyID, favorites_playlist])
            console.log(`PlaylistID: ${playlistID}`);

            userProfile["favorites_playlist"] = playlistID
            console.log(this.$store);
            return db.ref(`users/${userProfile.spotifyID}`).update(userProfile)
            
        },

이것은 사용자를 파이어베이스에 바인드하는 내 계정 모듈 내의 액션입니다.

const state = () => ({
    //user: { voted_tracks: {}, favorited_tracks: {}, favorites_playlist: null, authID: null}
    user: {},
})
const actions = {
    bindCurrentUser: firebaseAction(({ bindFirebaseRef }, id) => {
      return bindFirebaseRef('user', db.ref('users').child(id))
    }),
}

그 외에 어떤 정보가 더 관련이 있을지 잘 모르겠습니다.this.$store.state.account.user는 Vuexfire를 통해 데이터베이스 참조에 바인딩됩니다.저장소가 루트 구성 요소에 주입됩니다.

데이터는 다음 시간 이후에 수신됩니다.console.log를 클릭하면 콘솔이 오브젝트/어레이 로그를 현재 값으로 업데이트하지만, 프리미티브에서는 업데이트할 수 없습니다.자세한 내용은 이 답변을 참조하십시오.

하는 것으로 충분할 것이다await그firebaseAction:

await this.$store.dispatch("bindCurrentUser", userProfile.spotifyID)

bindCurrentUser: firebaseAction(({ bindFirebaseRef }, id) => {
   console.log("account.bindCurrentUser() called");
   return bindFirebaseRef('user', db.ref(`users/${id}`)).then(() => {
       console.log("account.bindCurrentUser() -- complete")
   }).catch((err) => {console.log(err)})
}),

언급URL : https://stackoverflow.com/questions/65388065/vuex-store-object-child-returns-undefined-parent-returns-properly-why