Vuex 및 Firebase 저장소 상태 오류

Vuex 및 Firebase 저장소 상태 오류

vuex 스토어에 다음과 같은 설정이 있습니다.내 사용자는 Firebase 인증으로 로그인합니다.로그인 시firebase.auth().onAuthStateChanged라고 불리며user로 설정되어 있다.state.userFirebase 데이터베이스에도 저장됩니다.코드의 마지막 부분을 추가하는 순간(database.ref...) 콘솔이 에러로 폭발합니다.그러나 이 오류는 Firebase가 아니라 Vuex와 관련이 있습니다.

에러는 다음과 같습니다(x80).

[Vue warn] :watcher "function ( )에 대한 콜백 오류입니다. { 반환됩니다._data.$state}:

오류: [vuex] 변환 핸들러 외부의 vuex 저장소 상태를 변환하지 않습니다.

내 코드는 아직 작동하지만 개발 중에 사용자가 로그인할 때 80개의 오류를 보고 싶지 않습니다.어떻게 하면 이 오류를 없앨 수 있을까요?

// actions
const actions = {
  startListeningToAuth ({ commit }) {
    firebase.auth().onAuthStateChanged((user) => {
      commit(types.SET_USER, { user })
    })
  }
}

// mutations
const mutations = {
  [types.SET_USER] (state, { user }) {
    state.user = user

    if (user) {
      database.ref('users/' + user.uid).set({
        name: user.displayName,
        email: user.email,
        photo_url: user.photoURL
      })
    }
  }
}

파이어베이스에는 toJSON() 메서드를 사용할 수 있습니다.사용자 인터페이스

commit(types.SET_USER, { user.toJSON() })

이렇게 하면 경고 없이 사용자 데이터를 스토어에 추가할 수 있지만 방화벽 기반에서 실시간 사용자 상태를 잃을 수 있습니다.

https://firebase.google.com/docs/reference/js/firebase.User#toJSON 를 참조해 주세요.

돌연변이는 vuex에 직접 영향을 미치는 코드만 포함해야 합니다.state.

에러가 발생하고 있는 것은,database.ref()가장 가능성이 높은 것은,user어떤 식으로든 반대하다당신의 돌연변이는state.user = user그 때문에,state.user객체가 사용자 이름과 동일한 객체를 참조하고 있습니다.user변수.그래서 만약에user변이를 벗어나면 상태도 변하고 Vue는 당신에게 소리칠 겁니다

이동해야 합니다.database.ref()관련 액션 메서드를 호출하고 변환을 커밋합니다.부터database.ref()는 비동기입니다.변환을 커밋하기 전에 이 메서드가 완료될 때까지 기다려야 합니다.

// actions
const actions = {
  startListeningToAuth ({ commit }) {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        database.ref('users/' + user.uid).set({
          name: user.displayName,
          email: user.email,
          photo_url: user.photoURL
        }).then(() => {
          commit(types.SET_USER, { user })
        })
      }
    })
  }
}

// mutations
const mutations = {
  [types.SET_USER] (state, { user }) {
    state.user = user
  }
}

등록 후 사용자 데이터를 설정하시겠습니까?이것은 이것을 하기 위한 나의 코드이다.

firebase.auth().createUserWithEmailAndPassword(email, password)
                .then((user) => {
                    //init user
                    userRef.child(user.uid).set({
                        email: email,
                        //Other data 
                    });
                })
                .catch((error) => {
                    state.isRegenter code hereister = false;
                    console.log(error);
});

언급URL : https://stackoverflow.com/questions/43328469/vuex-and-firebase-store-state-errors