关于useEffect中多次调用接口问题

首页课程实战体系课手记专栏慕课教程

关于useEffect中多次调用接口问题

来源：9-7 【中间件】使用redux-thunk中间价实现异步action

浅芷初夏

2023-01-17

图片描述
我在此处调用接口

页面上显示了两次打印数据，为什么？按理说 useEffect 的第二个参数传入了空数组，相当于vue中的mounted，应该只打印一次才对鸭。

传入空数组，有个波浪线提示说：useEffect 钩子缺少依赖项 dispatch，要么用数组包含它，要么移除数组；移除数组显然不行，会死循环，而提示里说的 dispatch 我也不确定是不是代码里我们写的 const dispatch = useDispatch(); 这个。

这个波浪线如果不处理，页面无警告无报错；
加上 const dispatch = useDispatch(); 这个dispatch 波浪线没了，页面也是无警告无报错；
感觉这好像是个bug

写回答

1回答

阿莱克斯刘

阿莱克斯刘

2023-01-30

不要奇怪，在严格模式下react的确会两次打印数据，请同学在index.tsx文件中把StrictMode去掉就好了。不过，需要注意的是，StrictMode渲染两次的情况仅存在于dev环境中，目的是为了让开发者更好的检查副作用；部署到生产环境以后，StrictMode将只会渲染一次。

React StrictMode 生命周期为什么会执行两次？ - 二柒席地而坐 - 博客园 (cnblogs.com)

1

1

浅芷初夏

谢谢老师，我俩礼拜把你的这门课肝完了😁。useEfectte 第二个参数经常会被eslint报错，是eslint的问题，忽略就好。

2023-01-30

共1条回复

React18 系统精讲结合TS打造旅游电商平台

React18 精讲 + 结合 TS 实战 + 热门业务开发，获取必备技能

1993 学习 · 1015 问题

相似问题

关于componentDidMount中的接口调用两次的问题

回答 1

关于 useEffect

回答 1

用useEffect来控制subscribe订阅时，切换语言无法触发卸载时的处理

回答 1

useEffect的问题

回答 1

TypeError: Cannot read property 'touristRoutes' of undefined

回答 1

打开慕课网App查看更多内容