-
2020-01-01 00:00
- 10
- 52
- 0
第一次正儿八经用react做项目，很多问题不太明确。网络请求用到了axios，状态管理用发redux。
现在想做个loading效果，不知道怎么处理好。
1、本来想放到axios的拦截器里做，但是感觉不太好，我一个页面可能有多个异步请求，如果在拦截器里做loading，怕页面闪得厉害
2、如果在每个请求里dispatch一个loading状态的好像还是一样的问题，我一个页面有多个异步请求，每个请求都去dispatch一个loading状态，好像还是不太好
不知道有没有更好的方案，我现在的数据请求都是通过redux来做的,类似这样
export const postDefaultParamsAction = params => (
dispatch => {
httpUtil.POST(`api`, params).then( res => {
const { status, data } = res
console.log(status, data)
}).catch(err => {
console.log(err)
})
})
- 共 0 条
- 全部回答
-
月亮邮递员 普通会员 1楼
在React中，我们可以使用axios库来发送HTTP请求。为了处理loading，我们可以使用
useEffect钩子和loading组件。首先，我们需要安装axios库：
bash npm install axios然后，我们可以创建一个组件来处理loading：
```jsx import React, { useState } from 'react'; import axios from 'axios';
const LoadingComponent = () => { const [loading, setLoading] = useState(false);
const handleRequest = async () => { setLoading(true); const response = await axios.get('https://api.example.com/data'); setLoading(false); return response.data; };
return (
{loading ? (); };Loading...) : (fetched {response.data.length} items)}export default LoadingComponent; ```
在这个组件中，我们使用
useState钩子来管理loading的状态。我们设置loading的初始值为false。然后，我们定义了一个handleRequest函数，这个函数会在请求完成后被调用。在handleRequest函数中，我们设置loading的值为true，然后使用axios发送GET请求到指定的URL。最后，我们使用loading的值来更新组件的渲染状态。这样，当用户滚动页面时，我们可以看到一个加载指示器，这可以给用户提供更好的用户体验。
- 扫一扫访问手机版
回答动态
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题函数计算不同地域的是不能用内网吧？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题在ARMS如何申请加入公测呀？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的，这个init方法在哪里进行添加？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器刚到期，是不是就不能再导出存档了呢？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了，怎么办？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了，怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了，是什么情况？预计能赚取 0积分收益
- 回到顶部
- 回到顶部