提问人：GN. 提问时间：12/21/2022 更新时间：12/21/2022 访问量：38
使用效果/调度多个网络调用
useEffect / dispatch multiple network calls
问：
useEffect(() => {
function initDashboardData() {
console.count("initDashboardData");
void dispatch(getDatabasesList());
void dispatch(getUserConfig());
void dispatch(
getHistoricalData({ startTimestamp: getDateXDaysAgo(14, new Date()), endTimestamp: new Date() })
);
}
void initDashboardData();
}, [dispatch]);
所有操作（getDatabasesList、getUserConfig 等）都是调用 API 的 Redux 操作。createAsyncThunk
当组件呈现此函数时，调用大约五次，创建 5 次网络调用。
如何使用 dispatch w/ useEffect 防止发生多个网络调用？
答：
0赞
Greg Motyl
12/21/2022
#1
为了防止多次调用该函数，您可以使用钩子的帮助，如下所示：useRef
const dataLoadedFlag = useRef(false);
useEffect(() => {
function initDashboardData() {
// dispatch your stuff...
dataLoadedFlag.current = true;
}
if (!dataLoadedFlag.current) {
initDashboardData();
}
}, [dispatch]);
评论
[]