React项目中fetch异步请求怎么加loading?

#1

问题:

在React项目中,使用fetch异步请求,在发起请求到响应请求返回数据之间

加个loading,比如“加载中…”之类。获取到数据后再删除或隐藏loading。
应该怎么加?求解!谢谢

我现在的代码是:

fetch(url).then((res) => {

    return res.json()

}).then((data) => {

    console.log(data);

}).catch(err =>{

    console.log(err)

})
#3

/*显示loading*/
showloading()

fetch(url).then((res) => {

    return res.json()


}).then((data) => {
   
   /*隐藏loading*/
    hidenloading()
    console.log(data);

}).catch(err =>{
    
   /*隐藏loading*/
    hidenloading()
    console.log(err)

})

#4

赞同Jesper的写法,
要补充的是
1 显示loading可以稍作延迟处理,
假如很快就获取到数据的话,页面会有闪烁的情况出现
2 对请求的路径做区分
也许有些接口不需要loading
3 如果项目用dvajs 的话, dva-loading 是个不错的插件

#5

谢谢!知道在哪里添加Loading,后面的就懂了!

#6

谢谢!知道在哪里添加Loading,后面的就懂了,涉及到的判断比较多!