React 学习笔记 15 (antd && axios实现全局Loading)

这篇博客介绍了如何在React应用中,结合antd库和axios库,设置全局的网络请求加载状态。通过拦截器配置,实现在每次发送网络请求时显示Loading效果,请求完成时自动关闭。
摘要由CSDN通过智能技术生成

网络请求的时候的loading效果

utils/intercepter.js

/**
 * Discription: 封装interceptor
 * author: ydj
 * Date: 2021-09-25 14:29:45
 */
 import axios from 'axios'
 import { message } from 'antd'
 /**
  * 生成基础axios对象,并对请求和响应做处理
  * 前后端约定接口返回解构规范
  * {
  *    code:200,
  *    data:"成功",
  *    message:""
  * }
  */
 // 创建实例
 const service = axios.create({
     baseURL: process.env.NODE_ENV === 'production' ? '/api' : '',
     // 配置请求头
     headers: {
         // post: {
         //     'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
         // }
         'C
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值