微信小程序-项目案例 (三)全局变量及封装网络请求
来源:互联网 发布:网络公关公司排行 编辑:程序博客网 时间:2024/05/16 16:04
1:配置全局变量 (app.js 文件)
App({ globalData: { requestUrl: "https://api.xxxxxx.com" // 网络接口全局变量 }})
先新建一个公共文件 里面可以封装公共类
如:utils/util.js
function httpRequest(url, callBack) { var _self = this; wx.request({ url: url, data: {}, header: { 'content-type': 'application/json' // 默认值 }, success: function (res) { callBack(res.data); // 成功后回调方法 }, fail: function (erro) { console.log(erro) } })}// 导出module.exports = { httpRequest: httpRequest}
接下来 我们就 可以在页面中 调用网络请求方法了 !
调用前 先引用
var app = getApp();
var util = require(‘../../../utils/util.js’); // 根据自己的项目路径引入
在 onLoad 生命周期函数里 发请求
/** * 生命周期函数--监听页面加载 */ onLoad: function (options) { // 提示 数据加载中 wx.showLoading({ title: '加载中', }) // 后面是拼接的 url 参数 var dataUrl = app.globalData.httpRequest + "xxxxx"; util.httpRequest(dataUrl, _self.backData) }
backData()这个方法 是请求成功后 回调后的数据处理 , 这个方法大家可以先忽略,后续我会继续更新 !
最后数据请求成功后 , 我们要关闭 加载中提示
if (this.data.movies.length != 0 ){ setTimeout(function () { wx.hideLoading() }) }
movies 为数据返回后的集合 ,判断这个是否为 0 ,当不等于 0 时 ,说明接口已经请求成功 返回数据了,这个时候 我们就可以关闭 ,提示了 !
阅读全文
0 0
- 微信小程序-项目案例 (三)全局变量及封装网络请求
- 微信小程序(三):网络请求
- 微信小程序实践(二)网络请求的封装
- 【微信小程序】网络请求接口封装实例
- 微信小程序之网络请求简单封装
- 小程序-网络请求封装
- SnailApp项目---网络请求封装
- 微信小程序项目案例及Demo
- 【微信小程序】封装网络请求并在wxml调用
- Android 项目(一):网络请求封装(一)
- retrofit 异步网络请求 小项目案例
- 小程序-网络请求框架封装
- 项目优化-Http网络请求的封装
- RN实战项目网络请求封装(二)
- RN实战项目网络请求封装
- 微信小程序-封装http请求(ajax)
- 微信小程序 http请求封装详解及实例代码
- 网络请求封装及使用(okhttp)
- 统计学习方法(第二章)感知机
- 【技术重温】html之概述
- Link-Cut Trees 板子
- 2017.12.03.学习日记(集合)
- 消息队列系列之ActiveMQ(JMS、集群配置)
- 微信小程序-项目案例 (三)全局变量及封装网络请求
- Jquery-选择器
- [Parser] Build: PL By: JS
- 在Mac电脑上实现到Linux主机的ssh免密登陆
- 软件测试(二)
- JavaWeb学习笔记-Web基础-01
- MPAndroidChart直方图(BarChart),渐变,左右滑动
- Tensorflow学习始于MNIST
- 【每日一题(1)】开门人和关门人 HDU