访问API数据与ES6在小程序中的应用

看待组件的两种观点

组件复用

代码分离-(特别重要)

  • 不能在一个页面写所有的代码,代码分离具有很强的可读性、可维护性

Blink Api 介绍与测试API

url前缀以bl.7yue.pro/v1开头

使用开发者key(appkey)访问API

  • 在请求头的header里面携带appkey
  • 将appkey做为请求参数

状态码和错误码


生命周期函数

小程序内部自己调用

名字是固定的

page({
data: {},
onLoad: function(option){},//监听页面加载,用于获取服务器数据
onReady: function(){},//监听初次渲染完成
onShow(){},//监听页面显示
onHide: function(),//监听页面隐藏
onUnload: function(){},//监听页面卸载
onPullDownRefresh: function(){},//监听用户下拉动作
onReachBottom: function(),//上拉触底事件的处理函数
onShareAppMessage: function(){}//分享操作函数
})

wx.request-4xx状态码不会执行fail

注意:服务器返回的数据都会是success,当网络中断时才会走fail


访问API获取数据

wx.request({
url: 'xxx',
header: {
appkey: 'xxx'
}
})

同步、异步与回调函数

小程序里面的request都是异步的,它的优势是性能很高,但调试编程都比较难


ES6箭头函数与this指代

success:(res)=>{
console.log(this.data.count);
}
let that = this;
...
success: function(){
console.log(that.data.count);
}

正确理解Promise

正确的使用场景:异步嵌套


ES6 const常量

配置文件一般用const定义

const config = 2;
config = 3;//报错
config.appkey = 1;//不报错,因为没有修改config的内存地址

ES6 Module export 与 import

在类里面定义方法的写法

import {config} from 'xxx';
class HTTP{
request(param){ }
}
export const config = {

} 或
const config = {}
export {config}

HTTP类的封装与ES6 startsWith与异常处理

startsWith的用法

success: (res)=>{
let code = res.statusCode.toString();
if(code.startsWith('2')){ }else {
//错误处理
}
}

错误处理

const tips = {
1: '抱歉,出现一个错误'
1005: 'appkey无效',
3000: '期刊不存在'
}
class HTTP{
request(param){
...
}
_show_error(error_code){
if(!error_code){
error_code = 1;
}
wx.showToast({
title: tips[error_code],
icon: 'none',
duration: 2000
})
}
}

小程序开发-7-访问api数据与ES6在小程序中的应用的更多相关文章

  1. 支付宝小程序开发——获取位置API没有城市区号的最佳处理方案

    前言: 需要对城市区号进行判断,但是支付宝小程序提供的my.getLocation() API返回的数据中只有6位的城市行政代码,诸如:深圳(440300),并没有区号(0755),那么怎么办呢? 需 ...

  2. 小程序开发总结一:mpvue框架及与小程序原生的混搭开发

    mpvue-native:小程序原生和mpvue代码共存 问题描述 mpvue和wepy等框架是在小程序出来一段时间之后才开始有的,所以会出现的问题有:需要兼容已有的老项目,有些场景对小程序的兼容要求 ...

  3. Facebook再现丑闻,约100位应用程序开发人员偷看用户数据

    Facebook今天披露了另一起安全事件,承认大约100名应用程序开发人员可能不正确地访问了某些Facebook组中的用户数据,包括他们的姓名和个人资料图片. 在周二发布的博客文章中,Facebook ...

  4. 【Abode Air程序开发】移动设备、桌面和浏览器应用程序开发的差异

    移动设备.桌面和浏览器应用程序开发的差异 在移动设备应用程序中使用 Spark 和 MX 组件的限制 移动设备应用程序在性能方面的注意事项 浏览器  将应用程序部署为 SWF 文件,以用于在浏览器中运 ...

  5. 为小程序开发创建本地mock数据服务器

    开发时使用easy-mock的服务,不是大厂就不是大厂,实在恶心,每天都会有卡的这么一段时间 于是,自己建个本地mock服务算了,想使用express 但是必须把json数据里面的不同对象,分配到不同 ...

  6. 微信小程序开发-易源API的调用

    起因:在开发一款旅游类微信小程序时,需要接入大量的景点信息,此时可以选择自己新建数据库导入数据并读取,但是对于我来说,因为只有一个人,数据库还涉及到需要维护方面,选择调用已有API. 过程:首先查阅微 ...

  7. 微信小程序开发3之保存数据及页面跳转

    第一  保存本地数据 1.异步保存本地数据 wx.setStorage({ key:keyStr, data:dataStr, success: function(e){}, fail: functi ...

  8. python web开发-flask访问请求数据request

    Request对象在web应用的开发中是一个非常重要的对象,主要用来获取用户发来的请求数据. 常用属性参考:http://docs.jinkan.org/docs/flask/api.html#fla ...

  9. AIR 程序开发系列 之五 保存数据的几种方式

    Local SharedObject 这种方法比较简单方便的保存少的数据到到设备中.你不用自己去管理这些数据,设备会自动管理他. SharedObject 在 flash.net 包中,继承自Even ...

随机推荐

  1. asp.net超过字数限制用省略号...表示

    显示8个字,多于8个字, 用...表示           <asp:Repeater runat="server" ID="MsgLists">  ...

  2. 保存Google、Bing翻译的语音

    以Chrome浏览器+google翻译为例,bing的下载步骤也类似 1.打开google翻译页面(translate.google.com),输入一段文本,如下图 2.可以看到,右侧已经翻译好了,这 ...

  3. swift的特性:扩展、协议、泛型

    swift的特性:扩展.协议.泛型 扩展与继承:对象的生长方式: 协议:支持 协议->类型.类型<-协议 的双向抽象: 泛型:

  4. WIN7系统 64位出现 Net Framework 数据提供程序要求 Microsoft Data Access Components(MDAC).

    WIN7系统 64位出现  Net Framework 数据提供程序要求 Microsoft Data Access Components(MDAC).请安装 Microsoft Data Acces ...

  5. BZOJ 2763: [JLOI2011]飞行路线 【分层图模板】

    任意门:https://www.lydsy.com/JudgeOnline/problem.php?id=2763 2763: [JLOI2011]飞行路线 Time Limit: 10 Sec  M ...

  6. jackson简单实用

    ---------------------------------------------------------------------------------------------------- ...

  7. 【洛谷P2607】[ZJOI2008]骑士

    骑士 题目链接 这道题一看,似乎和舞会是一样的,然而它并没有保证是一棵树 但是,对于每个连通块,必有相同的点数和边数,这样的图一定是一棵树上加一条边 这条边一定回使图中形成一个环,这种图貌似叫“基环树 ...

  8. EJB3 调用的存储过程

    要调用存储过程,我们可以通过 EntityManager 对象的 createNativeQuery()方法执行 SQL 语句 (注意:这里说的是SQL 语句,不是 EJB3 QL), 调用存储过程的 ...

  9. c# 后台线程 访问前台控件并显示信息

    //设置为后台线程 Thread th = new Thread(delegate() { append(); }); th.IsBackground = true; th.Start(); //在a ...

  10. 让IIS支持无后缀名访问

    IIS中添加对Mime类型 .   application/octet-stream