uni-app中使用flyio请求_uniapp能否上架

uni-app中使用flyio请求_uniapp能否上架前言:因为最近需要使用uni-app进行小程序的开发,所以最近在搭建小程序的环境,作为一个使用vue的前端小白,自然选择了支持vue的uni-app。但是uni自带的uni.request需要自己封装(因为懒)所以选择了flyio进行请求封装。环境配置:npminstallflyio在这里我使用npm进行安装,也可以下载源文件wx,js或者wx.umd.min.js1.先看一下np…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

前言:

因为最近需要使用uni-app进行小程序的开发,所以最近在搭建小程序的环境,作为一个使用vue的前端小白,自然选择了支持vue的uni-app。但是uni自带的uni.request需要自己封装(因为懒)所以选择了flyio进行请求封装。

环境配置:

npm install flyio
在这里我使用npm进行安装,也可以下载源文件
wx,js或者wx.umd.min.js

1.先看一下npm安装后的使用方法:

1.1 创建一个api.js,初始化一个fly实例,然后在里面封装所需要的接口。
这里我使用了easy-mock进行接口测试

import Fly from "flyio/dist/npm/wx"

const fly = new Fly;


// 配置请求根域名
fly.config.baseURL = " https://www.easy-mock.com/mock/5df0a676d0843e1ef18f6e7d";
// 配置响应拦截器
fly.interceptors.response.use(
    (response) => {
        // 如果请求报错
        if (response.data.code != 10000) {
            uni.showModal({
                title: '温馨提示',
                content: response.data.data
            })
        } else {
            //只将请求结果的data字段返回
            return response.data.data
        }
    },
    (err) => {
        //发生网络错误后会走到这里
        return Promise.resolve("网络请求:ERROR!")
    }
);
// 配置请求拦截器
fly.interceptors.request.use((request) => {
    request.headers["token"] = uni.getStorageSync('token');
    return request;
});

async function wxLogin() {
    return await new Promise((resolve, reject) => {
        wx.login({
            success(res) {
                if (res.code) {
                    resolve(res.code)
                }
            }
        })
    })
}

// 登录
export const login = async (params) => {
    console.log('开始登录...');
    let code = await wxLogin();
    let res = await fly.get('/user/login', {code: code});
    uni.setStorageSync('token', res.token);
    uni.setStorageSync('openid', res.openid)
};

//普通接口
export const getList = async (params) => {
    let res = await fly.get('/getlist', params);
    console.log(res)
};

1.2 然后在main.js或者app.vue里全局引入即可使用

import Vue from 'vue'
import App from './App'
import * as API from './static/utils/api'

Vue.prototype.$api = API;
Vue.config.productionTip = false;

App.mpType = 'app';

const app = new Vue({
    ...App
});
app.$mount();

2.先看一下npm安装后的使用方法:

var Fly=require("../lib/wx") //wx.js为您下载的源码文件
var fly=new Fly; //创建fly实例

只是引入方式不同而已。

3.其他官方方法请直接看文档吧,我要搬砖去了flyio886~

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

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/196077.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 1s看懂555定时器,以及应用?

    1s看懂555定时器,以及应用?555定时器是美国Signetics公司1972年研制的用于取代机械式定时器的中规模集成电路,因输入端设计有三个5kΩ的电阻而得名。此电路后来竟风靡世界。目前,流行的产品主要有4个:BJT两个:555,556(含有两个555);CMOS两个:7555,7556(含有两个7555)。555定时器是一种模拟和数字功能相结合的中规模集成器件。一般用双极型(TTL)工艺…

    2022年6月23日
    35
  • 【Java】输入—Scanner用法(全)[通俗易懂]

    【Java】输入—Scanner用法(全)[通俗易懂]Scanner用法目录1、输入整数、字符串数组2、输入二维数组3、输入字符串4、输入字符串分割为数组5、连续输入数字和字符串6、换行输入数字和字符串7、换行输入数字和字符串(需要包含空格)1、输入整数、字符串数组第一行输入n,m第二行输入n个整数第三行输入m个字符串//导入包importjava.util.Scanner;import…

    2022年7月16日
    9
  • vue 二维码生成插件_vue生成二维码组件

    vue 二维码生成插件_vue生成二维码组件效果图1,下插件cnpmivue-qr–save2,在需要的页面引入,或者全局引入,我这里是局部引入,因为只有一个页面用到了。html<vue-qr:text=”text”:size=”200″:margin=”0″/>jsimportVueQrfrom’vue-qr’exportdefault{components:{VueQr},data(){ return{ text:”,//二维码内容 .

    2022年10月4日
    0
  • 信用卡行为评分风险等级_信用卡综合评分标准

    信用卡行为评分风险等级_信用卡综合评分标准WOE&IVwoe全称叫WeightofEvidence,常用在风险评估、授信评分卡等领域。IV全称是Informationvalue,可通过woe加权求和得到,衡量自变量对应变量的预测能力。虽然网上到处都是神经网络、xgboost的文章,但当下的建模过程中(至少在金融风控领域)并没有完全摆脱logistic模型,原因大致有以下几点:logistic模型客群变化的敏感度不如其他高…

    2025年6月13日
    0
  • 音频数字化简单原理「建议收藏」

    音频数字化简单原理     从字面上来说,数字化(Digital)就是以数字来表示,例如用数字去记录一张桌子的长宽尺寸,各木料间的角度,这就是一种数字化。跟数位常常一起被提到的字是模拟(Analog/Analogue),模拟的意思就是用一种相似的东西去表达,例如将桌子用传统相机将三视图拍下来,就是一种模拟的记录方式。两个概念:1、分贝(dB):声波振幅的度量单位,非

    2022年4月17日
    60
  • latex 中括号_文件标题中用小括号用法

    latex 中括号_文件标题中用小括号用法Z单边大括号align或alignedarraycase\left\\{和\right.控制括号大小使用\left和\right使用\big,\Big,\bigg,\Bigg控制括号的大小各种括号单边大括号align或aligned$$f(x)=\left\{\begin{aligned}x&=\cos(t)\\y&=\sin(t)\\…

    2022年8月31日
    1

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号