Request

网络请求

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

在 mpvue 中如何使用

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

1. 创建一个 fly 实例

  1. let fly =newFly;

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. });
  9. //query参数通过对象传递
  10. fly.get('/user',{
  11. id:133
  12. })
  13. .then(function(response){
  14. console.log(response);
  15. })
  16. .catch(function(error){
  17. console.log(error);
  18. });

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. }
  4. function getUserProjects(){
  5. return fly.get('/user/133/projects');
  6. }
  7. fly.all([getUserRecords(), getUserProjects()])
  8. .then(fly.spread(function(records, projects){
  9. //两个请求都完成
  10. }))
  11. .catch(function(error){
  12. console.log(error)
  13. })

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