react hook 的 setState 没有 callback 大家是怎么使用得心应手的哦?

2021-03-05 16:45:48 +08:00
 HariopaNic
比如一个最基础的刷新列表功能:
刷新调取的函数
const onRefresh = async () => {
setRefreshing(true);
setPageNo(1);
setIsListEnd(false);
setList([]);
initList();
setRefreshing(false);
}
拿数据的函数
const initList = async () => {
if (isLoading || isListEnd) return;
setIsLoading(true);
//在此处调取 api
let res =......;
setList(list.concat(res));
setPageNo(pageNo + 1);
setIsLoading(false);
if (res.length < pageSize) setIsListEnd(true);
}
在刷新函数里 set 的值在 initList 函数里使用时都不是最新的,没有 callback 使用咋那么不得劲呢,有没有大佬指点下该怎么改,谢谢了。
1128 次点击
所在节点    问与答
15 条回复
HariopaNic
2021-03-05 16:53:17 +08:00
up……
HariopaNic
2021-03-05 17:00:52 +08:00
up
HariopaNic
2021-03-05 17:00:58 +08:00
uppppp
kyuuseiryuu
2021-03-05 17:17:51 +08:00
有用到 state 的函数要用 useCallback

const fn = useCallback(initList, [list, pageNo, isLoading, isListEnd]);
newbieRenew
2021-03-05 17:34:19 +08:00
你都 async 了。await 后再 set
PeakFish
2021-03-05 17:40:16 +08:00
用 useEffect 监听数据改变处理啊, 你没发现 useEffect 就是 vue 里面的 watch 吗。监听变量改变然后自己操作。
JetMac
2021-03-05 17:51:29 +08:00
HariopaNic
2021-03-05 17:55:08 +08:00
@JetMac 你这个就进入的时候调用一次啊,我的场景是 set 之后在 fetchdata 函数中拿不到最新的 state
HariopaNic
2021-03-05 17:55:48 +08:00
@newbieRenew await setState 没用吧,我试了下没效果。
newbieRenew
2021-03-05 18:02:16 +08:00
你是不是用到定时器了,记得清除
Hanser002
2021-03-05 18:31:05 +08:00
你可以把 useEffect 当成 callback 使用
yushiro
2021-03-05 19:05:08 +08:00
用 useEffect,监听某个 state 的值,发生变化了,就会执行 effect
momocraft
2021-03-05 19:09:31 +08:00
如果你非常想要 callback 应该可以用 useState+useRef+useEffect 糊一个
imjamespond2020
2021-03-05 19:34:42 +08:00
好拿最新值直接 setFoo(foo=>这是最新的 foo)。。。。
DOLLOR
2021-03-05 19:52:59 +08:00
setState 可以接受一个函数,函数的参数就是最新值。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/758863

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX