超出最大调用堆栈大小（在 Nuxt + Firebase 项目中）答案

【问题标题】：Maximum call stack size exceeded( in Nuxt + Firebase Project)超出最大调用堆栈大小（在 Nuxt + Firebase 项目中）
【发布时间】：2020-11-15 16:23:40
【问题描述】：

我目前正在 Nuxt 和 Firebase 中创建身份验证功能。

登录和注销过程本身可以完成，并且标题显示相应更改，但是当我按下登录按钮时控制台出现错误。

错误内容（在控制台中）

Uncaught RangeError: Maximum call stack size exceeded
    at Function.keys (<anonymous>)

代码

Header.vue（这是包含登录按钮的页面。）↓

googleLogin () {
      const provider = new firebase.auth.GoogleAuthProvider()
      auth.signInWithPopup(provider)
        .then(res => {
          this.dialogAuthVisible = false
          this.$store.dispatch('auth/setUser',res.user)
        }).catch(e => console.log(e))
 }

store/auth.js↓

export const strict = false

export const state = () => ({
  user: null
})

export const mutations = {
  SET_USER (state, payload) {
    state.user = payload
  }
}

export const actions = {
  setUser ({ commit }, user) {
    commit('SET_USER',user)
  }
}

export const getters = {
  isAuthenticated (state) {
    return !!state.user
  }
}

default.vue↓

mounted () {
    auth.onAuthStateChanged(user => {
      const { uid, displayName, photoURL} = user
      if (user) {
        this.$store.dispatch('auth/setUser', { uid, displayName, photoURL})
      } else {
        this.$store.dispatch('auth/setUser', null)
      }
    })
  }

如果我缺少任何信息，请告诉我????️。请教我怎么做????️.

【问题讨论】：

这个错误通常来自无限递归。如果您可以提供带有复制功能的 jsfiddle 或 codepen，我可以更深入地了解
auth 变量是如何定义的？
谢谢你们。这是身份验证变量 const auth = firebase.auth()

标签： firebase vue.js nuxt.js

【解决方案1】：

我认为问题出在以下代码行：

export const mutations = {
  SET_USER (state, payload) {
    state.user = payload
  }
}

export const actions = {
  setUser ({ commit }, user) {
    commit('SET_USER',user)
  }
}

这种突变和动作之间存在一个循环

【讨论】：

谢谢！！我已经考虑过了，但我不知道如何解决它。请帮帮我。