微信小程序入门 请求的封装

首先介绍下小程序的学习过程，我是一个客服端开发 对小程序一直很感兴趣，正赶上 公司要开发小程序，就一边学习一边开发，写下这个博客，希望能和大家一起成长。

如果还对小程序不了解 可以去看微信公众平台看文档，这里就不介绍开发工具的安装了 https://mp.weixin.qq.com/debug/wxadoc/dev/
小程序开发框架的目标是通过尽可能简单、高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务。

框架提供了自己的视图层描述语言 WXML 和 WXSS，以及基于 JavaScript 的逻辑层框架，并在视图层与逻辑层间提供了数据传输和事件系统，可以让开发者可以方便的聚焦于数据与逻辑上。

今天先介绍下网络请求的方式，微信提供了方法

wx.request({

     url: 'https://URL',

     data: {},

     method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT

     // header: {}, // 设置请求的 header

     success: function(res){

       // success

     },

     fail: function() {

       // fail

     },

     complete: function() {

       // complete

     }

   })

这个是微信提供的，下边这个是我简单封装的，首先在公共的js方法app.js中进行代码的封装
 fetch(url, data, callback) {

    wx.request({

      url: url,

      data: data,

      method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT

      header: {

         "Content-Type": "application/json"

      }, // 设置请求的 header

      success: function(res){

        // success

        callback(null,res.data);

      },

      fail: function() {

        // fail

        callback(e)

      },

      complete: function() {

        // complete

        wx.hideNavigationBarLoading();

      }

    })

然后在想要用到的页面中调用就可以了

首先调用app.js的方法引用var app = getApp()

 然后在onLoad中调用app.fetch("https:", {}, (err, data)
=> { that.setData({picList:data.data})});

Constant.Main_ScrollPic_URL是我的URL 我把它放在了constant.js中，获取的数据我放到了picList数组中下边是我的请求总代码

var Constant = require('../../utils/constant.js');

var app = getApp()

Page({

  data:{

    totalPage:"",

    list:[],

    picList:[],

    refreshTextStr:"",

    isRefresh:true

  },

  onLoad:function(options){

    // 页面初始化 options为页面跳转所带来的参数

    var that = this;

    // 封装的请求

    app.fetch(Constant.Main_ScrollPic_URL, {}, (err, data) => { that.setData({picList:data.data})});

   requestData(that);

   

  }