每个小程序都需要在app.js中调用应用方法注册小程序示例,绑定生命周期回调函数,错误监听和页面不存在监听函数等。
详细的参数含义和使用请参考应用参考文档。
整个小程序只有一个应用实例,是全部页面共享的。开发者可以通过getApp方法获取到全局唯一的应用示例,获取应用上的数据或调用开发者注册在应用上的函数。
我们在做小程序的时候往往需要大量的请求,而请求的域名也都是相同的,我们可以把域名储存到全局变量中,这样会方便后面请求域名的修改。(user_id、unionid user_info之类经常用到的都可以放在全局变量中)
//app.js 应用程序({ globalData: { user_id:空, unionid:空, url: " https://xxx.com/index.php/Home/Mobile/",//请求的域名 user_info:零 } })
当在页面中使用时记得要引用下应用。js,小程序已经提供了方法
//index.js//获取应用实例 const应用=getApp()//获取应用//让url=app.globalData.url;//使用方法,可先定义或者直接使用app.globalData.url wx.request ({ url: app.globalData。url + ' checkfirst ',//就可以直接在这里调用 方法:“文章”, 标题:{“内容类型”:“应用程序/x-www-form”} 数据:{}, 成功:(res)=在{}
当我们调用接口请求时要通过请求返回的数据改变页面数据经常要用到临时指针来保存这指针。
但如果使用ES6的箭头函数就可以避免
<强>使用临时指针强>
onLoad:功能(选项){ 让这=//保存临时指针 wx.request ({ url: url +“GetCouponlist”, 方法:“文章”, 标题:{“内容类型”:“应用程序/x-www-form-urlencoded”}, 数据:{}, 成功(res) { 那setData({//使用临时指针 coupon_length: res.data.data.length }) } })
<强>使用ES6箭头函数()=比;{}强>
成功:(res)=比;{ 这一点。setData({//此时这仍然指向onLoad coupon_length: res.data.data.length }) }
在小程序中http请求是很频繁的,但每次都打出wx。请求是很烦的,而且代码也是冗余的,所以我们要把他封装起来
首先要在跑龙套文件夹中新建一个js,我命名为请求。js,在里面封装出post和get的请求,记得最后要声明出来
//封装请求 const应用=getApp () 让主人=app.globalData.url/* * *职位请求 *模型:{ * url:接口 * postData:参数{} * doSuccess:成功的回调 * doFail:失败回调 *} */函数postRequest(模型){ wx.request ({ url:主机+ model.url, 标题:{ “内容类型”:“应用程序/x-www-form-urlencoded” }, 方法:“文章”, 数据:model.data, 成功:(res)=比;{ model.success (res.data) }, 失败:(res)=比;{ model.fail (res.data) } }) }/* * *让请求 *模型:{ * url:接口 * getData:参数{} * doSuccess:成功的回调 * doFail:失败回调 *} */函数getRequest(模型){ wx.request ({ url:主机+ model.url, 数据:model.data, 成功:(res)=比;{ model.success (res.data) }, 失败:(res)=比;{ model.fail (res.data) } }) }/* * * module.exports用来导出代码 * js中通过让电话=要求(“. ./util/request.js”)加载 */模块。出口={ postRequest: postRequest, getRequest: getRequest }
这一步非常重要记得添加!
模块。出口={ postRequest: postRequest, getRequest: getRequest }
使用时就在相应的页面顶部调用,页面外部噢
让电话=要求(“. ./. ./跑龙套/request.js”)
使用的时候↓
<强>得到
强>
//获取广告图 call.getRequest ({ url:“GetAd”, 成功:(res)=祝辞{//箭头函数没有指针问题 this.setData ({ urlItem: res.data }) } })微信小程序开发技巧汇总