10年匠心专业提供互联网设计开发方案

原创设计 定制开发

满足您的个性化需求

uniapp uni.request封装

封装uni.requerst然后使用

uniapp中uni.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;
			},



使用声明

1. 本站所有素材(未指定商用),仅限学习交流请勿用于商业用途。

2. 原创商用和VIP素材,未经合法授权,会员不得以任何形式发布、传播、复制、转售该素材,否则一律封号处理。

3. 如果素材损害你的权益请联系客服vx:13230981129给予处理。

热门标签

王孟旺
微信扫一扫立即咨询
公众号
在线客服
在线联系
17330196230 13230981129 18830906230
顶部
账号登录|扫码登录

立即注册 |忘记密码?

欢迎注册

已有账号马上登录

重置密码

扫码绑定微信
微信扫一扫

绑定手机号