简单的封装一个uniapp接口

 

api.js

// 封装请求:get post
// 面向对象es6 promise  等等。。。

// 引进提示
import {errdata} from 'api/errdata.js'

// GET
let getAction = function(urling,shopdata){
    return new Promise((resolve,reject)=>{
        uni.request({
            url:urling,
            method:'GET',
            data:shopdata,
        })
        .then((res)=>{
            console.log(res,"get请求的res")
            resolve(res[1])
        })
        .catch((err)=>{
            let errs = '服务器错误 请稍后再试'
            errdata.errlist(errs)
            reject(err)
        })
    })
}

// POST请求
let postAction = function(urling,shopdata){
    return new Promise((resolve,reject)=>{
        uni.request({
            url:urling,
            method:'POST',
            data:shopdata,
            
        })
        .then((res)=>{
            // console.log(res[1])
            resolve(res[1])
        })
        .catch((err)=>{
            let errs = '服务器错误 请稍后再试'
            errdata.errlist(errs)
            reject(err)
        })
    })
}

// POST请求
let postAction2 = function(urling,shopdata){
    return new Promise((resolve,reject)=>{
        uni.request({
            url:urling,
            method:'POST',
            data:shopdata,
            header: {
                'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
            },
        })
        .then((res)=>{
            // console.log(res[1])
            resolve(res[1])
        })
        .catch((err)=>{
            let errs = '服务器错误 请稍后再试'
            errdata.errlist(errs)
            reject(err)
        })
    })
}

export{getAction,postAction,postAction2}

配套的弹窗

// 提示
const errdata = {
    errlist(err){
        uni.showToast({
            icon:'none',
            title: err,
            duration: 3000
        });
    }
}

export{errdata}

简单的接口地址封装(写起来有些复杂,但是看起来还好)

// 公用地址
let url = "http://192.168.2.185:8080/dpc"


//上传图片接口
let accidentUpload = `${url}/common/accidentUpload`

// 登录接口
let loginByUniApp = `${url}/loginByUniApp`


export{
    accidentUpload,
    loginByUniApp,
    }

 

代码中的应用示例

<script>
    // 地址
    import {loginByUniApp} from '@/api/request.js'
    export default {
        data() {
            return {
                userName: "", 
            }
        },
        methods: {
            loginBtn() {
                this.$postAction(loginByUniApp,{
                    user:this.userName
                }).then((res)=>{
                    if(res.data.code == 0){

                    }else{
                        
                    }
                })
            },
         },
    }
</script>

 

posted @ 2021-03-10 17:48  卖糖纸的小糖果  阅读(290)  评论(0)    收藏  举报