Request

网络请求

request 指的是小程序中的网络请求，在 mpvue 框架中可以通过小程序提供的原生 API wx.request 来进行相关的处理。但是在这里推荐一个第三方的网络请求库 fly。之所以推荐这个第三方库，是因为可以在多个端上实现代码的复用，目前已支持的有 Node.js 、微信小程序 、Weex 、React Native 、Quick App。

在 mpvue 中如何使用

安装
  1. npm install flyio   ||   cnpm install flyio
引入
  1. import Fly from "flyio/dist/npm/wx";
使用

1. 创建一个 fly 实例

  1. let fly = new Fly;

2. 发起GET请求

  1. //通过用户id获取信息,参数直接写在url中
  2. fly.get('/user?id=133')
  3.   .then(function (response) {
  4.     console.log(response);
  5.   })
  6.   .catch(function (error) {
  7.     console.log(error);
  8.   });
  10. //query参数通过对象传递
  11. fly.get('/user', {
  12.       id: 133
  13.   })
  14.   .then(function (response) {
  15.     console.log(response);
  16.   })
  17.   .catch(function (error) {
  18.     console.log(error);
  19.   });

3. 发起POST请求

  1. fly.post('/user', {
  2.     name: 'Doris',
  3.     age: 24
  4.     phone:"18513222525"
  5.   })
  6.   .then(function (response) {
  7.     console.log(response);
  8.   })
  9.   .catch(function (error) {
  10.     console.log(error);
  11.   });

4. 发起多个并发请求

  1. function getUserRecords() {
  2.   return fly.get('/user/133/records');
  3. }
  5. function getUserProjects() {
  6.   return fly.get('/user/133/projects');
  7. }
  9. fly.all([getUserRecords(), getUserProjects()])
  10.   .then(fly.spread(function (records, projects) {
  11.     //两个请求都完成
  12.   }))
  13.   .catch(function(error){
  14.     console.log(error)
  15.   })

5. 直接通过 request 接口发起请求

  1. //直接调用request函数发起post请求
  2. fly.request("/test",{hh:5},{
  3.     method:"post",
  4.     timeout:5000 //超时设置为5s
  5.  })
  6. .then(d=>{ console.log("request result:",d)})
  7. .catch((e) => console.log("error", e))

更多请求方法与实例可前往 fly 中文文档 查看

效果

request01