在mpvue引入flyio
先来说微信小程序原生的请求接口方式吧,如官网文档,在页面中请求直接调用
在这里感谢接的是提供的免费接口https://blog.csdn.net/c__chao/article/details/78573737
wx.request({
url: 'https://api.apiopen.top/searchAuthors', //仅为示例,并非真实的接口地址
data: {
name: '李白'
},
header: {
'content-type': 'application/json' // 默认值
},
success (res) {
console.log(res.data.result)
}
})
好了,不如正题说一下Flyio,依葫芦画瓢写了一下
1.首先安装flyio
npm install flyio --save
2.引入flyio。新建一个js文件,request.js
import Vue from 'vue'
const Fly = require("flyio/dist/npm/wx")
const fly = new Fly
fly.config.baseURL = 'https://api.apiopen.top/'
Vue.prototype.$http = fly
export default fly
还可以配置你的拦截器、响应时间等。。
3.页面中请求接口,调用就可以啦
import request from '@/utils/request'
getRequest(){
request.get('recommendPoetry').then((d)=>{
console.log(this.article = d.data.result)
}).catch(error=>{
console.log(error)
})
}
好啦,运行一下,完美

在mpvue引入flyio的更多相关文章
- 微信小程序搭建mpvue+vant+flyio
导语 上一篇文章微信小程序搭建mpvue+vant已经介绍了如何搭起mpvue项目及引入vant,本篇文章继续在它的基础上,引入flyio,并做一些封装,目的是为了在小程序发起请求. 这时读者会有些疑 ...
- mpvue——引入echarts图表
安装 mpvue-echarts的github地址 https://github.com/F-loat/mpvue-echarts $ cnpm install mpvue-echarts $ cnp ...
- mpvue——引入antv-F2图表
踩坑中~ 官方文档 https://www.yuque.com/antv/f2/intro 毕竟不像echarts接触过,所以还是先看看文档较好 github https://github.com/s ...
- mpvue + vant + flyio 小程序项目总结
vant 的使用 我开始是 npm 导入,然后 import,使用不了. 找了各种方法,最后还是下载文件,然后找到 dist 文件夹,复制到项目里,我是放在 static 文件夹,文件名 dist 重 ...
- 小程序mpvue中flyio的使用方法
Fly.js 一个基于Promise的.强大的.支持多种JavaScript运行时的http请求库. 有了它,您可以使用一份http请求代码在浏览器.微信小程序.Weex.Node.React Nat ...
- mpvue——引入vant_weapp组件
克隆仓库 克隆后,将dist目录下的所有文件复制到项目中的/static/vant/目录下,vant目录是我自己创建为了区分的 git clone https://github.com/youzan/ ...
- mpvue——引入iconfont字体图标
前言 有问题可以随时提问,评论私信,只要我有时间我都会第一时间回复.当大家发现这篇文章不适用的时候烦请告知下,我好做好更改! 放置 下载好的字体图标放在static目录下,我是自己又创建了一个icon ...
- mpvue——引入echarts打包vendor过大
前言 有一个项目需要引入图表,当时有两种选择一种是mpvue-echarts,一种是F2,而我经过踩坑之后依然决然的选择了mpvue-echarts,简单快捷容易上手,主要之前用过比较熟悉. 问题 | ...
- 微信小程序搭建mpvue+vant
第一步:查看是否已经装了node.js $ node -v $ npm -v 正确姿势 没有装的话前往Node.js官网安装 第二步:安装cnpm $ npm install -g cnpm -- ...
随机推荐
- Django如何启动源码分析
Django如何启动源码分析 启动 我们启动Django是通过python manage.py runsever的命令 解决 这句话就是执行manage.py文件,并在命令行发送一个runsever字 ...
- VLAN实验5(在ensp上利用三层交换机实现VLAN间路由)
原理概述: VLAN将一个物理的LAN在逻辑上划分成多个广播域.VLAN内的主机间可以直接通信,而VLAN间不能直接互通. 在现实网络中,经常会遇到需耍跨VLAN相互访问的情况,工程师通常会选择一些方 ...
- yarn和npm的对比以及yarn的使用
0--前言 为什么要使用yarn,如果你从事前端开发有些年头了,那你肯定对npm又爱又恨,爱就不说了,恨嘛,就是NPM经常奇慢和卡顿,这还能忍,经常各种错误就没法忍了,尤其是他人创建的项目,自己在安装 ...
- Spring Cloud第一篇 | Spring Cloud前言及其常用组件介绍概览
本文是Spring Cloud专栏的第一篇文章,了解本篇文章内容有助于更好的理解后面文章 一.网站架构演变过程 1-1.传统架构 传统的SSH架构,分为三层架构 web控制层.业务逻辑层.数 ...
- Android Native Binder,在Native层与App交互数据
Binder底层是基于C实现的,因此可以作为Native进程与App层交互数据的渠道.其应用场景为:Native Service.Hal驱动设置.应用层JNI服务等. Android 4.4引入SEA ...
- thinkPHP5开发智慧软文遇到的分页第二页不显示数据的问题
在进行结果查询进行分页的时候,发现分页第一页数据正常,第二页没有数据,后面问题一样,这个是因为直接使用了: 如果此处使用如下语句: $lst=NewsModel::order('sendtime de ...
- http://t.cn/xxxxx的短链接如何生成?
var convertStr = encodeURIComponent(urlStr); //转换的原链接可能存在"&"这样的特殊符号,导致原链接的某些字段会被当做ajax ...
- 企业日常巡检shell脚本
Linux内部查看系统信息 $INTERNET192忽略 [root@ mysql-master ~]# ip a|grep eth0|grep inet|cut -d' ' -f6|cut -d'/ ...
- nginx部署安装
首先需要下载Nginx软件包 nginx软件官方下载地址:[nginx官方下载连接](http://www.nginx.org) 建议选择稳定的软件版本,如果练习使用当然是无所谓,随便什么版本都可以, ...
- java基础-泛型举例详解
泛型 泛型是JDK5.0增加的新特性,泛型的本质是参数化类型,即所操作的数据类型被指定为一个参数.这种类型参数可以在类.接口.和方法的创建中,分别被称为泛型类.泛型接口.泛型方法. 一.认识泛型 在没 ...