mangosteen day 4 swr原理

程序员 2024-9-6 09:26:21 74 0 来自 中国
当我们要判定是否用户是否登录 使用到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)  })
您需要登录后才可以回帖 登录 | 立即注册

Powered by CangBaoKu v1.0 小黑屋藏宝库It社区( 冀ICP备14008649号 )

GMT+8, 2024-11-22 06:37, Processed in 0.173806 second(s), 32 queries.© 2003-2025 cbk Team.

快速回复 返回顶部 返回列表