关于使用context 来做全局ajax loading 的问题
来源：1-1 课程导学
媳妇的号我来学
2021-11-12
老师您好，想使用axios的intercept拦截器来实现全局的请求loading效果，
1、我创建了一个loadingContext 提供出isLoading 和 setLoading()
2、 在index.tsx使用这个loadingContext 来包裹整个APP
3、在App.tsx 中使用antd的组件 Spin 包裹所有的子节点 并 引入 loadingContext 中的isLoading 变量进行控制
4、当有请求时 在 axios.intercept.request.use((config=>{
const context = useContext(loadingContext);
context.setLoading(true);
}))
5、当响应时 在 axios.intercept.response.use((config=>{
const context = useContext(loadingContext);
context.setLoading(false);
}))
结果 ：
1回答
-
Nolan
2021-11-13
这个错误是在说，hook只能在组件或者其他hook中被调用。在你的代码里，axios.intercept.request.use(...), use里面是一个普通的回调函数，里面是不能调用useContext这种hook的。正确的做法是(没验证，给你提供个思路)：
const App = () => {
const context = useContext(loadingContext);
useEffect(() => {
axios.intercept.request.use((config=>{
context.setLoading(true);
}))}, [])
}
00
相似问题