Uni-app封装请求

新建一个api.js文件，主要放请求封装的代码

const baseUrl = 'http://172.0.0.1:8080';
const httpRequest = (opts, data) => {
    let httpDefaultOpts = {
        url: baseUrl + opts.url,
        data: data,
        method: opts.method,
        header: opts.method == 'get' ? {
            'X-Requested-With': 'XMLHttpRequest',
            "Accept": "application/json",
            "Content-Type": "application/json; charset=UTF-8"
        } : {
            'X-Requested-With': 'XMLHttpRequest',
            'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        },
        dataType: 'json',
    }
    let promise = new Promise(function(resolve, reject) {
        uni.request(httpDefaultOpts).then(
            (res) => {
                resolve(res[1])
            }
        ).catch(
            (response) => {
                reject(response)
            }
        )
    })
    return promise
};
//带Token请求
const httpTokenRequest = (opts, data) => {
    let token = "";
    uni.getStorage({
        key: 'token',
        success: function(ress) {
            token = ress.data
        }
    });
    //此token是登录成功后后台返回保存在storage中的
    let httpDefaultOpts = {
        url: baseUrl + opts.url,
        data: data,
        method: opts.method,
        header: opts.method == 'get' ? {
            'Token': token,
            'X-Requested-With': 'XMLHttpRequest',
            "Accept": "application/json",
            "Content-Type": "application/json; charset=UTF-8"
        } : {
            'Token': token,
            'X-Requested-With': 'XMLHttpRequest',
            'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        },
        dataType: 'json',
    }
    let promise = new Promise(function(resolve, reject) {
        uni.request(httpDefaultOpts).then(
            (res) => {
                resolve(res[1])
            }
        ).catch(
            (response) => {
                reject(response)
            }
        )
    })
    return promise
};

export default {
    baseUrl,
    httpRequest,
    httpTokenRequest
}

封装代码为二种，一种是无token请求，另一种是token，按照自己的需求去调用想要的请求方式

在main.js将它全局挂载

import Vue from 'vue'
import App from './App'
import {
    myRequest
} from './util/api.js'

Vue.prototype.$myRequest = myRequest

Vue.config.productionTip = false

App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()

在页面中使用$myRequest(可自己定义)去调用封装好的请求方法

let opts = {
    url: '/api/add',
    method: 'post'
};
let param = {
    deviceId: this.deviceCode,
    deviceName: this.deviceName
};
$myRequest.httpTokenRequest(opts, param).then(res => {
    console.log(res.data);
    //打印请求返回的数据

}, error => {
    console.log(error);
})

到这里一个简易详情的uni-app封装请求就结束了，自己有更多的需求，可以自己去添加和修改