美文网首页
react 对axios简单封装

react 对axios简单封装

作者: 南土酱 | 来源:发表于2022-09-08 10:13 被阅读0次

在src 目录下 新建 api文件夹, 新建一个 baseApi.js
还有 pages文件夹下的每个页面的文件对应的 api文件

例如 home主页就建个 home.js
home
baseAPI.js
import axios from "axios";

const client = axios.create({
  baseURL: "http://localhost:8080/api",
  //withCredentials: true,
});
export default client;

这里前后端分离项目 要配置的 withCredentials 可以看我另一篇文章
👉前端携带 sessionID Access-Control-Allow-Credentials 跨域 - 简书 (jianshu.com)

home.js

//async/await 写法:
import client from "./baseAPI"
async function getDailyAdd(){
    const response = await client.get("/home/dailyAdd");
    return response['data']
    
}
//promise 写法
async function getMonAdd(){
    return new Promise((resolve,rej)=>{
        client.get("/home/monAdd").then((res)=>{
            resolve(res.data)
        }).catch((v)=>{
            rej(v)
        })
    })
}
export {getDailyAdd,getMonAdd}

如此便可以调用接口了

 let result = getMonAdd()
        result .then((v) => {
          do something
  })

相关文章

  • react 对axios简单封装

    在src 目录下 新建 api文件夹, 新建一个 baseApi.js还有 pages文件夹下的每个页面的文件对应...

  • 在VUE中科学使用axios

    在项目中安装axios 封装axios 新建api/index.js文件,对axios进行简单的封装,方便使用。真...

  • (二)axios的封装

    axios封装代码 在vue和react的开发过程中,经常需要对axios进行封装,现将项目中的axios保留,以...

  • 基于axios的二次封装

    1、 axios的封装前言 axios是一个基于 promise 的 HTTP 库,目前,在vue,react框架...

  • React封装axios

    安装axios 建立请求js index.js引入封装js

  • axios封装(简单封装)

    菜鸟一枚,如有错误,欢迎指正。 安装 npm install axios; 1.引入 import axios f...

  • axios请求封装

    axios封装 简单设置本地mock数据

  • axios 封闭http请求

    公司用react开发项目,特意封装了一个axios请求 代码如下: 使用方式

  • axios简单封装

    Vue 折腾记 - 给axios做个挺靠谱的封装(报错,鉴权,跳转,拦截,提示) 借鉴引用 本篇文章给大家带来的内...

  • axios简单封装

    本想着直接用,不要封装,也很方便。后来发现还是要简单封装一下,省掉一些重复的验证。重点在resolve和rejec...

网友评论

      本文标题:react 对axios简单封装

      本文链接:https://www.haomeiwen.com/subject/nxtonrtx.html