useEffect在堆栈导航中不工作
useEffect在堆栈导航中不工作
提问于 2022-10-04 16:25:14
我在Stack Navigator有两个屏幕。
所有类别， 添加一个新的类别
在“所有类别”屏幕中，将显示所有类别。
useEffect(() => {
loadCategories();
}, []);这是加载所有类别的useEffect钩子。
我制作了一个可触摸的不透明度来导航到，添加了一个新的类别屏幕，因此用户可以在需要时轻松地添加一个新的类别。
我希望做的事情：，所以在添加了一个新类别并返回到之后，屏幕loadCategories()应该再次运行，这样用户就可以看到新添加的类别了。但问题是，当我添加一个新类别并返回时，loadCategories()函数将不再执行。原因是什么？
回答 3
Stack Overflow用户
回答已采纳
发布于 2022-10-05 06:08:28
我找到了这个与这个问题有关的答案。https://stackoverflow.com/a/62703838/19317939
import {useIsFocused} from '@react-navigation/native';
...
const isFocused = useIsFocused();
useEffect(() => {
if (isFocused) loadCategories();
}, [isFocused]);Stack Overflow用户
发布于 2022-10-05 05:19:25
如果希望在屏幕为焦点时加载类别
function Categories({ navigation }) {
React.useEffect(() => {
const loadCategories = navigation.addListener('focus', () => {
loadCategories();
});
return loadCategories;
}, [navigation]);
...rest
}Stack Overflow用户
发布于 2022-10-05 05:43:41
通常，当我们回到一些屏幕时，我们需要获取数据，
为此，有一个来自@react导航/本机库(useFocusEffect)的钩子，我们可以使用它来完成这样的需求。
为了快递。
import { useFocusEffect } from '@react-navigation/native';
function Profile({ userId }) {
const [user, setUser] = React.useState(null);
useFocusEffect(
React.useCallback(() => {
const unsubscribe = API.subscribe(userId, user => setUser(user));
return () => unsubscribe();
}, [userId])
);
return <ProfileContent user={user} />;
}在上面的代码中，每当ProfileContent屏幕聚焦时，useFocusEffect中的代码就会重新运行。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73950864
复制相关文章
相似问题
腾讯云开发者
