mangosteen day 4 swr原理

程序员 · 2024-9-6 09:26:21

当我们要判定是否用户是否登录使用到SWR

意为 stale-while-reavalidate 这是一个库
意为当用户数据逾期将重新发起哀求得到最新数据
步调：起首从缓存中返回体现的是逾期的数据，同时会发起fetch哀求（重新认证），末了得到最新数据

与zustand举行类比

全部长途的数据(http哀求的数据）都缓存到swr中，别的的数据存储到zustand即可

当我们在使用swr发送关联哀求的时间

须要使用到Mock

1.当后端还没有接口的时间 须要mock来举行模拟

2.没有实现登岸的情况下，须要改变用户的登岸状态，篡改端口返回的值

使用swr发送哀求
const { data: meData, error: meError } = useSWR('/api/v1/me', (path) => { return ajax.get(path) }) const { data: itemsData, error: itemsError } = useSWR( '/api/v1/items', (path) => { return ajax.get(path) })

相较于useSWR会自动的调用useEffect
第一个参数传我们访问的路径
第二个我们须要返回我们怎样获取对应的数据（代码中的path对应的就是第一个参数的路径）

若两个哀求的关系是嵌套的关系可以直接使用?:的方法 如图中的meData是作为依靠只有在第一层哀求乐成，myData得到值之后才举行第二层的哀求
const { data: meData, error: meError } = useSWR('/api/v1/me', (path) => { return ajax.get(path) }) const { data: itemsData, error: itemsError } = useSWR(meData ? '/api/v1/items' : null, (path) => { return ajax.get(path) })

mangosteen day 4 swr原理

所属分类: 问答交流

新帖推荐: 30日

推荐作品