1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 微信小程序请求后台接口(完整版)

微信小程序请求后台接口(完整版)

时间:2020-08-30 13:52:21

相关推荐

微信小程序请求后台接口(完整版)

按照我写的Demo阐述下,三种方法都可以,看各自的需求使用吧
方式一: 以点击事件的形式 :

// 其他页面内容就不展示了,按照自己的结构去渲染数据<button type="button" bindtap="test">点击请求接口</button >

Page({data: {// 接收请求过来的数据listDate: ''}});test() {// 为确保this指向不发生改变,可以固定下this指向//使用this的时候用that代替即可var that = thiswx.request({// 注意,如果小程序开启校验合法域名时必须使用https协议//在测试的情况下可以不开启域名校验url: '这里是要请求接口的地址',data: {// 接口设置的固定参数值canOne: '1',canTwo: '2'...},// 请求的方法method: 'GET', // 或 ‘POST’// 设置请求头,不能设置 Refererheader: {'content-type': 'application/json' // 默认值},// 请求成功时的处理success: function (res) {// 一般在这一打印下看看是否拿到数据console.log(res.data)if (res.statusCode == 200) {var array = res.datathat.setData({// 将res.data保存在listDate方便我们去循环遍历listDate: res.data// 统计所有数据deviceNum: array.length})}},// 请求失败时的一些处理fail: function () {wx.showToast({icon: "none",mask: true,title: "接口调用失败,请稍后再试。",});}})}

方式二:在onLoad函数中

/*** 生命周期函数--监听页面加载*/onLoad: function (options) {// 可以将上面`test`方法中的代码直接写在onLoad生命周期函数//等页面加载完就可以自动请求接口,获取数据},

方式三:使用方法调用的形式,定义一个方法如上面的test方法将网络请求放在其中,然后在onLoad中调用,这也是在开发中经常用到的形式,更显得代码规范,易维护。

/*** 生命周期函数--监听页面加载*/onLoad: function (options) {// 可以将上面的test视为一个方法,然后在onLoad生命周期函数中调用//和方式二一样就不用绑定点击事件了this.test()},

PS:使用这种方式都后期需要更改接口公共路径,比如:更改接口域名的时候会显得非常麻烦,每个接口都需要找出来进行更改,既然如此麻烦那不如封装下request请求,将请求接口的公共路径单独拿出来,到后期需要更改的时候只需要更改公共路径就可以了。相关代码已经整理好了,需要的可以前往查看,希望可以给同胞们带来帮助。关于如何封装wx.request请求,请点击查看我的另一篇文章

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。