更新记录

1.0.0（2024-03-18）

项目发布

平台兼容性

一、网络请求

一个支持Promise和拦截器的网络请求

二、简介

基于Promise开发，网络请求，支持、请求地址、请求类型、请求参数动态配置，项目级别的网络请求库，它有更小的体积，易用的api，方便接口管理与后期维护。

三、ruquest封装

import env from '@/config/env.js';
import tool from '@/utils/tool.js';
/**
 * @exports
 * 网络请求
 */
function service(options = {}) {
    options.load == true ? tool.loading(options.loading) : false;
    options.timeStart = Date.now();
    options.url = options.url != undefined ? `${env.baseUrl}${options.url}` : options.urls;
    options.header = options.header != undefined ? options.header : {
        'content-type': 'application/x-www-form-urlencoded;charset=utf-8',
    };
    return new Promise((resolved, rejected) => { // resolved是返回成功数据，rejected返回错误数据
        options.success = (res) => {
            // 如果请求回来的状态码不是200则执行以下操作
            if (res.statusCode !== 200) {
                tool.condition(res.statusCode) // 返回错误信息
            } else {
                if (res.data.code == -1 || res.data.code == -2) { // 错误提示（根据项目情况进行判断）
                    tool.setTimeout(res.data.message)
                } else {
                    resolved(res.data) //返回正常
                }
            }
            options.load == true ? tool.hideLoading() : false;
            if (env.isLog) {
                console.log('========================================================================')
                console.log('==  接口地址：', options.url)
                console.log('==  请求头部：', options.header)
                console.log('==  接口参数：', options.data)
                console.log('==  请求类型：', options.method)
                console.log("==  接口状态：", res.statusCode);
                console.log("==  消耗时间：", `${Date.now() - options.timeStart} 毫秒`);
                console.log('==  后台返回：', res);
                console.log('==  取值列表：', res.data);
                console.log('========================================================================')
            }
        };
        options.fail = (err) => {
            tool.toast('服务器正在升级，给您带来不便，敬请谅解。') // 请求失败弹窗
            rejected(err);
            options.load == true ? tool.hideLoading() : false;
        };
        uni.request(options);
    });
}

export default service;

四、使用

示例

<script setup>
    import tool from '@/utils/tool.js'
    import {
        ref
    } from 'vue'
    import {
        onLoad
    } from "@dcloudio/uni-app"
    import {
        getPicType,
    } from '@/config/api.js';

    const picList = ref([])

    onLoad(() => {
        getPics()
    })

    const getPics = async () => { //获取图片类别
        let res = await getPicType('WallPaper', 'getAllCategoriesV2', '360chrome')
        picList.value = res.data
    }

    const onItem = (item) => { //类别事件
        tool.toast(item.name)
    }
</script>

五、请下载示例工程项目