15年软件开发经验 只做源码定制 互联网+定制化解决方案

15年软件开发经验,只做源码定制!

原创设计 定制开发

满足您的个性化需求

当前位置:首页 前端开发 uinapp

uniapp uni.request封装

王孟旺| 发布于 2022-03-22 21:33:12| 667阅读| 0点赞| 0评论
举报

封装uni.requerst然后使用

uniappuni.request用的比较多,用起来起来过于麻烦通常封装后使用提高效率

首先创建一个js文件

上代码:

const BASE_URL = 'https://huoguo.qinfenniao.com' //域名或选取所有接口不变的那一部分

export const myRequest = (options) => { //暴露一个function:myRequest,使用options接收页面传过来的参数  

        return new Promise((resolve, reject) => { //异步封装接口,使用Promise处理异步请求

            uni.request({ //发送请求

                url: BASE_URL + options.url, //接收请求的API

                method: options.method || 'POST', //接收请求的方式,如果不传默认为POST

                data:options.data || {}, //接收请求的data,不传默认为空

                success: (res) => { //数据获取成功

                    if (res.data.code !== 1) { //因为200是返回成功的状态码,如果不等于200,则代表获取失败,

                        return uni.showToast({

                            title: "数据获取失败!"

                        })

                    }

          // console.log(res.data.datas);

                    resolve(res.data) //成功,将数据返回

                },

                fail: (err) => { //失败操作

                    uni.showToast({

                        title: "请求接口失败!"

                    })

                    reject(err)

                }

            })

        })

    }


 封装好以后在mian.js全局挂载

import app from './app'
import { myRequest } from './api/encapReq.js'
// #ifndef VUE3
import Vue from 'vue'
Vue.prototype.$API = myRequest //挂载到Vue的原型上
Vue.config.productionTip = false
app.mpType = 'app'
const app = new Vue({
    ...app
})
app.$mount()
// #endif

最后就可以载你写的页面使用了


async swiperFu() {
				let res = await this.$API({
					url: '/api/coupon/carous',
				});
				this.swiperImg = res.datas;
			},



0

0条评论

别默默看啦~登录/注册一起参与讨论吧~

热门标签

王孟旺
微信扫一扫立即咨询
账号登录|扫码登录

立即注册 |忘记密码?

欢迎注册

已有账号马上登录

重置密码

扫码绑定微信
微信扫一扫

绑定手机号

分享到-微信

举报

  • 举报类型:

  • 举报描述:

您好,当前积分不足。

在线客服
拨打电话
17330196230 13230981129
顶部