一、首先安装axios

安装axios指令:

npm install axios --save

二、封装axios

创建一个文件夹里面创建一个js文件封装一下axios,代码如下:

import axios from 'axios'

var request = axios.create({
    baseURL:'http://127.0.0.1:8000/myapp/',//基准地址
    timeout:5000
})
//拦截请求
request.interceptors.request.use((config)=>{
    return config
})
//拦截响应
request.interceptors.response.use((response)=>{
    return response
},function (error){
    //对响应的错误做点什么
    return Promise.reject(error);
}
)

export default request

三、封装请求

再创建一个js文件把请求封装一下方便与以后请求接口时候调用,代码如下:

import request from '../utils/request'

export function getUserList(params){
    return request({
        url:'xiaox/',//请求路由
        method:'get',//请求方式
        params:params//传递数据
    })
}

四、调用

首先引入封装的请求文件

import { getUserList } from '../../api/StuList'

调用

async getStu() {
        var msg = await getUserList('stu/', 'get')
        this.setState({ data: msg.data.data })
        console.log(this.state.data);
    }

 直接调用getUserList封装的请求把路由和请求方式传到封装好的函数里面,如果需要传值,直接在后面写字典就可以

var msg = await getUserList('stu/', 'post', this.state.addfrom)

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐