uniapp项目,axios请求封装

目录如下:


image.png

一、api.js

import http from './request.js'
// get请求
function getList(data) {
    return http({
        url: '/listIndex/lists',
        method: 'GET',
        data: {}
    })
}
// post请求
function editData(data) {
    return http({
        url: '/listEdit/edit',
        method: 'POST',
        data: {}
    })
}

export {
    getList,
    editData
}

二、baseUrl.js

const baseUrl = 'https://xxx.xxxxx.xx/xxxxxxx/xxxxx/api'
export default baseUrl

三、request.js

import baseUrl from "./baseUrl.js"

var http = function(config) {
    return new Promise((resolve, reject) => {
        uni.request({
            url: baseUrl + config.url,
            data: config.data,
            method: config.method,
            header: {
                'token': uni.getStorageSync('token')
            },
            success: res => {
                if (res.data.code == 401) {
                    uni.navigateTo({
                        url: `/page_my/wechatLogin/wechatLogin`
                    })
                    uni.clearStorage()
                    return
                }
                resolve(res.data)
            },
            fail(err) {
                reject(err)
            },
        })
    })
}
export default http

四、在代码中使用

<script>
  import {
        getList,
        editData,
    } from '@/http/api.js'
 // get请求
       async getList_api() {
                let res = await getList({page:this.page})
                console.log("res",res)
            },
// post请求
async editData_api() {
                let res = await editData({value:this.form})
                console.log("res",res)
            },
</script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容