firebase 的 onAuthStateChanged 如何在 reactJS 的 ComponentDidMount 生命周期中工作
How does firebase's onAuthStateChanged work in ComponentDidMount lifecycle in reactJS
谁能解释一下这个 onAuthStateChanged 函数在 componentDidMount 中是如何工作的。我知道这个生命周期挂钩只在组件安装时执行一次。那么里面的函数是怎么执行的呢?
我假设它就像回调函数,它在事件循环中保持 运行,当状态改变时被触发,就像 JS 中的 addEventlistner。
componentDidMount() {
console.log("Context Mounted");
firebaseapp.auth().onAuthStateChanged((user) => {
if (user) {
this.setState({ currentUser: user });
console.log("User Signed IN ");
} else {
console.log("THERE IS NO USER");
}
});
}
您几乎明白了它的要点:在您向 Firebase 注册您的 onAuthStateChanged
回调后,它将被调用:
- “立即”使用当前身份验证状态
- 只要身份验证状态发生变化
由于您调用 setState
将用户置于该状态,因此只要发生上述事件之一,就会触发 UI 的重新呈现。
这一直持续到应用程序退出或直到您注销侦听器,您通常应该在同一组件的 componentWillUnmount
方法中执行此操作。
谁能解释一下这个 onAuthStateChanged 函数在 componentDidMount 中是如何工作的。我知道这个生命周期挂钩只在组件安装时执行一次。那么里面的函数是怎么执行的呢?
我假设它就像回调函数,它在事件循环中保持 运行,当状态改变时被触发,就像 JS 中的 addEventlistner。
componentDidMount() {
console.log("Context Mounted");
firebaseapp.auth().onAuthStateChanged((user) => {
if (user) {
this.setState({ currentUser: user });
console.log("User Signed IN ");
} else {
console.log("THERE IS NO USER");
}
});
}
您几乎明白了它的要点:在您向 Firebase 注册您的 onAuthStateChanged
回调后,它将被调用:
- “立即”使用当前身份验证状态
- 只要身份验证状态发生变化
由于您调用 setState
将用户置于该状态,因此只要发生上述事件之一,就会触发 UI 的重新呈现。
这一直持续到应用程序退出或直到您注销侦听器,您通常应该在同一组件的 componentWillUnmount
方法中执行此操作。