reactjs 如何检测@react-navigation/bottom-tabs中选项卡焦点变化？

f2uvfpb9 于 2023-01-04 发布在 React

关注(0)|答案(1)|浏览(115)

我正在我的react-native项目中使用**@react-navigation/bottom-tabs**..有三个选项卡

| Home | Add | List |

所有这些屏幕都应该使用3个不同的API获取数据，并在用户访问这些选项卡时显示数据。但问题是我如何检测选项卡何时获得焦点？
我尝试使用useIsFocused（），但它不起作用...假设我在主屏幕中有一个API调用GetStudentsName（），并且我希望它在用户访问HomeTab时运行...但当我单击添加选项卡时，也会调用此**GetStudentsName（）**API！...
我怎样才能限制这个API调用只有当这标签得到焦点，而不是当这标签失去焦点？
请提供基于钩子的解决方案，而不是基于类的解决方案

reactjs

来源：https://stackoverflow.com/questions/70610296/how-to-detect-tab-focus-change-in-react-navigation-bottom-tabs

1条答案

按热度按时间

wh6knrhe1#

React Navigation提供了一个事件处理程序，用于在用户点击底部选项卡图标或按钮时调度事件。

React.useEffect(() => {
    const unsubscribe = navigation.addListener("tabPress", async (e) => {
     // add your business logic here
    })

// Unsubscribe to event listener when component unmount
 return () => unsubscribe();
  }, [ navigation]);

赞(0）回复(0）举报 2023-01-04

我来回答

reactjs 如何检测@react-navigation/bottom-tabs中选项卡焦点变化？

1条答案

相关问题

热门标签

最新问答