微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

uniapp 封装 网络请求

首先创建utils 然后新建 request.js

/**
 * 封装请求对象
 */

const BASE_URL = "https://xxxxx/xxxx/xxxxx/xxxx/api";

/**
 * 
 */
function request({url, data, method}) {
    return new Promise((resolve, reject) => {
        //uni.app 发起网络请求
        uni.request({
            url: BASE_URL + url,
            data,
            method,
            sslVerify: true,
            success: ({
                data,
                statusCode,
                header
            }) => {
                if (data.success){
                    //请求成功
                    resolve(data)
                }else{
                    //请求失败 提示用户
                    uni.showToast({
                        title:data.message,
                        icon:"success",
                        mask:true,
                        duration:2000
                    }); 
                    //进行失败回调
                    reject(data.message);
                }
            },
            fail: (errot) => {
                //请求错误 直接进行错误回调
                    reject(errot);
            }
        })
    })
}

/*导出*/
export default request;
request.js

里面的 base-url 自己设置,还有就是里面封装了promise  uni.request 中的一些参数完全可以自定义

里面存在些ES6 语法 慢慢看即可。

 

封装好了  使用封装:

1. 不规范就是直接用即可。。。。

 

我是很规范的好吗?  :::

新建文件夹 api  ,新建JS文件 然后里面写你指定的请求:

import request from '../utils/request';

/**
 * 热搜文章类型
 * 针对接口来写的啊  下面接口认GET所以不写methods ,没有参数 所以不写 data :
 */

export function getHottabs(){
    /**
     * 返回(Promise)
     */
    return request({
        url:'/test/test1'
    })
}

 

可以看到 所以这里返回了 我们就用  async  +  await 调用即可:

 

 

 

 

测试:

 

H 5 :

 

 

微信小程序: 

 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐