uniapp 使用 axios 请求

生成 package.json
npm init -y
安装 axios
npm install axios
封装 axios
//request.js
import axios from "axios";

// uniapp 必须要设置adapter
axios.defaults.adapter = function(config) {
    return new Promise((resolve, reject) => {
        console.log(config)
        var settle = require('axios/lib/core/settle');
        var buildURL = require('axios/lib/helpers/buildURL');
        uni.request({
            method: config.method.toUpperCase(),
            url: config.baseURL + buildURL(config.url, config.params, config.paramsSerializer),
            header: config.headers,
            data: config.data,
            dataType: config.dataType,
            responseType: config.responseType,
            sslVerify: config.sslVerify,
            complete: function complete(response) {
                response = {
                    data: response.data,
                    status: response.statusCode,
                    errMsg: response.errMsg,
                    header: response.header,
                    config: config
                };

                settle(resolve, reject, response);
            }
        })
    })
}

const env = {
    'dev': 'https://xxxxxxx.com',
    'test': 'https://xxxxxxx.com',
    'beta': 'https://xxxxxxx.com',
    'prod': 'https://xxxxxxx.com',
}

const baseUrl = env.test
let request = axios.create({
    baseURL: baseUrl,
    timeout: 10000, //设置超时时间
})
//请求拦截
request.interceptors.request.use(
    function(config) {
        // console.log("请求之前的配置项:", config);
        return config;
    },
    function(error) {
        return Promise.reject(error);
    }
)

//响应拦截器
request.interceptors.response.use(
    function(response) {
        // console.log("响应拦截器响应的数据,", response);
        return response.data;
    },
    function(error) {
        return Promise.reject(error);
    }
);
export default request; //把request暴露出去

api.js
import request from '@/utils/request.js'

const testPostUrl = 'xxxx'
const testGetUrl = 'xxxx'
export function testPost(data) {
    return request({
        url: testPostUrl,
        method: 'POST',
        data: data
    })
}

export function testGet(data) {
    return request({
        url: testGetUrl,
        method: 'GET',
        params: data
    })
}
调用
  import { testPost, testGet } from '@/api/api.js'
    export default {
        name: 'axios',

        data() {
            return {}
        },
        
        methods: {
            async testGetFunction() {
                const data = await testGet()
                console.log(data);
            },

            getUserApproveListFun() {
                const params = {}
                getUserApproveList(params).then(data => {
                    console.log(data);
                })
            },
        }
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容