
在我最近的项目中,我遇到了一个有趣的挑战,我相信很多人都遇到过——根据 react native 应用程序中的用户角色获取数据。
我已将用户角色(常规、管理员)添加到我的应用程序中,作为管理员,我需要获取系统中的所有作业。
执行此操作的逻辑很简单 – 检查登录用户的角色并相应地获取数据。但我没想到的是 react 的异步行为会如何影响我的逻辑。
这是我正在使用的初始代码片段:
const [loggedinuser, setloggedinuser] = usestate<partial | null>(null);const fetchjobs = async () => { try { let firebaseservice = await new firebaseservice(); let jobslist: job[] = []; if (loggedinuser?.role == userroles.admin) jobslist = await firebaseservice.listalljobs(); else jobslist = await firebaseservice.listsingleuserjob(); setjobs(jobslist); setfilterjobs(jobslist); } catch (error) { console.error('error fetching jobs:', error); } finally { setrefreshing(false); setisloading(false); } };useeffect(() => { const fetchuser = async () => { try { let user = await returnloggeduser(); setloggedinuser(user); } catch (error) { console.error('failed to fetch user', error); } }; fetchuser(); }, []); usefocuseffect( usecallback(() => { if (!hasrun) { fetchjobs(); sethasrun(true); }, [] );
usefocuseffect 在屏幕获得焦点时运行。
理论上来说,这是有道理的。但我不确定的是 loggedinuser 在我尝试获取作业之前始终会被定义。由于 useeffect 和 usefocuseffect 异步运行,因此无法保证 loggedinuser 会在 fetchjobs() 运行
时设置
这就是 react 的异步行为的体现。
我需要确保在继续作业获取逻辑之前已设置 loggedinuser。
通过添加对 loggedinuser 的检查,我确保 fetchjobs 仅在用户信息可用时运行:
useFocusEffect( useCallback(() => { if (loggedInUser && !hasRun) { fetchJobs(); setHasRun(true); }, [loggedInUser] );
继续建设!
以上就是在 React Native 和 Firebase 中使用用户角色处理异步状态的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1493424.html
微信扫一扫
支付宝扫一扫