我正在尝试使用documentSnapshot从Firestore中获取用户数据,我可以获取数据,但是它陷入了无限循环,正在更新用户数据,
这是代码
import firestore from '@react-native-firebase/firestore';
export default function HomeScreen() {
const { user, logout } = useContext(AuthContext);
const [currentUser, setCurrentUser] = useState('');
useEffect(() => {
firestore()
.collection('users')
.doc(user.uid)
.get()
.then(documentSnapshot => {
if (documentSnapshot.exists) {
setCurrentUser(documentSnapshot.data())
}
})
})
return (
<View style={styles.container}>
<Title>{currentUser.displayName}</Title>
<FormButton
modeValue='contained'
title='Logout'
onPress={() => logout()} />
</View>
)
}
答案 0 :(得分:1)
每次调用setCurrentUser
时,您都在强制重新呈现(因为这是一个状态变量)。然后您的useEffect
再次触发,再次调用setCurrentUser
,依此类推,导致无限循环。
为防止这种情况,您应设置useEffect
在触发前应监听的变量列表。您可以通过向useEffect
传递第二个参数来完成此操作。
useEffect(() => {
// your function call
}, [/* list of state/prop variables to respond to */])
如果您希望useEffect
仅触发一次,类似于componentDidMount
,则可以传递一个空数组。
来自docs:
如果您要运行效果并仅将其清理一次(在挂载和 卸载),则可以传递一个空数组([])作为第二个参数。这个 告诉React你的效果不依赖于道具的任何值 或状态,因此它不需要重新运行。这不是特殊处理 情况—直接取决于依赖项数组始终如何 有效。
在您的情况下,您似乎希望将user
放置在此数组中,因为这是您的Firestore调用所依赖的唯一变量。如果user.uid
没有更改,则没有理由再次触发该效果。