useEffect在没有刷新的自定义抽屉组件中不起作用

Question

所以我使用react-navigation 5，我有一个自定义抽屉组件为我的应用程序。我想在抽屉中显示登录用户的名称，我使用一个状态变量，我正在从firestore更新状态。我正在调用useEffect中的一个函数，它访问firestore并获取用户的名称。但我认为useEffect没有刷新就不能工作，因为除非我保存项目并刷新应用程序，否则状态不会在应用程序中更新，我无法看到用户的名称而不刷新，但刷新后它是可见的。知道为什么会这样吗?任何帮助都会很感激。谢谢你。

自定义抽屉

export default function CustomDrawer(props) {
const paperTheme = useTheme();
const [name,setName]=useState('');
useEffect(() => {
doStuff();
}, []);
const doStuff = async () => {
var phone=global.phone;
await firestore().collection("Users").where('Phone Number', '==', phone).get().then(querySnapshot=>{
querySnapshot.forEach(documentSnapshot => {
console.log("in drawer");
console.log(documentSnapshot.data());
setName(documentSnapshot.data().Name);               
})           
})
};
return(
<View style={{flex:1}}>
<DrawerContentScrollView {...props}>
<View style={styles.drawerContent}>
<View style={styles.userInfoSection}>
<View style={{flexDirection:'row',marginTop: 15}}>
<Avatar.Image 
source={{
uri: ''
}}
size={50}
/>
<View style={{marginLeft:15, flexDirection:'column'}}>
<Title style={styles.title}>{name}</Title>
</View>
</View>
</View>
</View>
</DrawerContentScrollView>
</View>
);
}

Answer 1

看起来您在useEffects之外定义了doStuff函数。

你需要把它放在useEffects或添加到依赖列表

useEffect(() => {
doStuff();
}, [doStuff]);