美文网首页
微信小程序-ajax的使用和封装

微信小程序-ajax的使用和封装

作者: Christoles | 来源:发表于2019-04-30 14:19 被阅读0次

    微信小程序的ajax使用方法:

    wx.request({
        url:'http://120.76.31.111/app/XhlGetSubjectTypeList',//随便拿个网址演示
        method:'get',
        success(res){
          console.log(res);
        }
    })
    

    ajax 函数封装

    在我们做项目的时候,为了方便复用,需要封装ajax函数方便随时调用

    首先,我们来在utils 文件夹的 util.js 文件中,封装ajax函数,并且用module.exports导出一下。
    在做项目的时候,建议把封装的函数都放在util.js文件中,方便管理。

    //--- 封装ajax请求,还需要导出
    function $request(_url,type,callback,data){
      wx.request({//微信的请求方法
        url:_url,
        method:type,
        data,
        header:{},//请求头
        success(res){
          callback(res);
        }
      })
    }
    module.exports = {
      $request //---ajax封装函数导出
    }
    

    第二、在需要用到ajax封装函数的文件中引入 util.js 文件 ,这里有2种引入写法

    //--- 2种引入封装好方法的文件的写法,没区别 ***
    // import util from '../../utils/util.js'
    // const util = require('../../utils/util.js')
    

    第三、引入之后,调用引入时定义的名字,使用如下:

    // ---使用已在utils/util.js中封装好的ajax函数,需要import引入到该页面中再使用:
    util.$request('http://120.76.31.111/app/XhlGetSubjectTypeList','get',function(res){
        console.log("封装ajax请求",res)
    })
    

    此外,也可以定义在 app.js 全局文件中

    app.js :

    const util = require('utils/util.js')
    

    需要用到 ajax 的文件 :

    //--- 先拿到 app 
    const app = getApp();
    //---在app.js中引入util并注册,再在这个js中拿到app的请求方法:
    app.globalData.util.promiseAjax('http://120.76.31.111/app/XhlGetSubjectTypeList', 'get').then(function (res) {
         console.log("app:",res)
    })
    

    相关文章

      网友评论

          本文标题:微信小程序-ajax的使用和封装

          本文链接:https://www.haomeiwen.com/subject/vdbpnqtx.html