微信小程序开发：ES6异步请求接口及嵌入示例

小程序项目根目录

1，pages[home]

2，utils[base.js]❙js3，js3，他们home文件夹包含：[home.js, home.json, home.wxml, home.wxss, home-model.js]

文件内容：

home.js

import { Home } from 'home-model.js';

var home = new Home(); //实例化首页对象

Page({

data: {

loadingHidden: false

},

,

{is.. },

/*加载所有数据*/

_ loadData: function(callback){

var that = this;❙ home.getBannerData((data) => {

that.setData( {

bannerArr：数据,

});

});*

});*

home.getThemeData((data) => {

that.setData({

themeArr: 数据,

loadingHidden: true

});});});});

/*获取单品信息*/

home.getProductOrData((data) => {

tHtHetData({

ProductSarr: data

});

Callback &&callback() ; });

},

/*跳转至产品详情*/

onProductsItemTap: function (event) {

;

wx.navigateTo({

url: '../product/product ?id=' + id

})

},* mp to/me /

onThemesItemTap: 函数（事件）{

var id = home.getDataSet (事件, 'id');

var name = home.getDataSet(event, 'name');

wx.navigateTo({

url: '../主题/主题?id=' + id+'&name='+ name

})

},

/*下拉刷新页面*/

onPullDownRefresh: function(){

>s. topPullDownRefresh()

})。

}

})home-model.js

/**

* 由 jimmy 创建于 17/2/26。

*/

//' ../utils/ base.js').base;

从 '../../utils/base.js'导入 {Base};

class Home 扩展 Base{ (){

super ();

}

/*横幅图片信息*/

getBannerData(callback){

var am={ † };

This.Request（参数）；

}

/*首页主题*/

getteMedata（回调）{

var param = {

url: '主题？ IDS = 1,2,3',

sCallback:函数(数据){

回调 && 回调(数据);

}

};

};

。 ？ 回调&&回调(数据); {首页};

home.wxml

特色主题

最新新品

加载中...

tpls/products/products-tpl.wxml

{{item.name}}

￥{{item.price}}

base.js

/**

* 由 jimmy- Jiang 创建，2016-11-21。

*/

import { Token } from 'token.js';import } from 'config .js ';

class Base {

构造函数（）{

“使用严格”;

this.base休息。 is.onPay= Config.onPay;

}

//http请求类，如果noRefech为true，则无未授权重试机制

request(params, noRefetch) {

l how =this.baseRestUrl + params.url;

if(!params.type){

params.type='get';

}

/*无需重新编译地址*/我

方法： params.type,

header: {

'content-type': 'application/json',

'token': wx.getStorageSync('token')♾❀} 成功: function ( res) {

//以2（2xx）开头的状态码被认为是正确的

//不要将异常返回给回调，在请求中处理，记录在日志中，ShowToast可以使用统一的错误代码

var code = res.statusCode.toString();

var startChar = code.charAt(0);

if (startChar == '2') {

params. sCallback && params.sCall返回（res.data）;

} else {

if（代码=='401'）{

if（！noRefetch）{

that._refetch（params）;} }

that._processError(res) I // WX.HIDENAVIGATIONBARLOADING ();

That._processerror (ERR);

// Params.ecallback && PARAMS.Ecallback (ERR);

}}）； _processError(err){

console.log(err);

}

_refetch(param) { to() = to(

); token.get TokenFromServer ( (token) => {

this.request(param, true);

});

}

/*获取元素上的绑定值*/ ♶S（事件，键）{

return event.currentTarget.dataset[key];

};

};

};

导出{Config.fig .

}; constructor(){

}

}

Config.restUrl = 'REST API基址';

Config.onPay=true; //是否启用支付

export {Config};

token.js

// 参考es6的模块介绍和定义

// 全局变量为g_

// 私有函数 _

import { Config.} from 'config.js class Token {

constructor() {

this.verifyUrl = Config.restUrl + 'token/verify';

this.tokenUrl'tok}

verify() {

this.verifyUrl = Config.restUrl + 'token/verify'; var token = wx.getStorageSync('token');

if (!token) {

this.getTokenFromServer() {❀el❙}); ❙❙

this._veirfyFromServer(token); }

}

_veirfyFromServer(token) {

var that = this{w.x. url：那个。 verifyUrl ,

方法：'POST'，

数据：{

令牌：令牌

}，

成功：val.id.s。 validsda

if(!valid){

that.getTokenFromServer();

}

}

})

})

}) var that =这个：{

code:res.code

},

成功:function(res){

wx.setStorageSync('token', res.data.token);cal);mp;callback(res.data.token);

}

})

}

})

}

}

}♶ }}地址.js

/**

* 由 jimmy 创建，9/17/3 'config.js';

类地址扩展 Base{

constructor() {

super();

}

}

} ){

var that=this;

var param={

url:'地址',

sCallback:function(res){

){){re.s (re.) = that.setAddressInfo(res);

回调 && 回调(res);

}

}

};

;

this.request} / *保存地址*/

_setUpAddress(res,callback){

var formData={

name:res.userName,

省份：资源城市, city

国家/地区:res.countyName,

手机:res.telNumber,

详细信息:res.detailInfo

};

};

};

/ *更新保存地址* /

submitAddress(data,callback){

data = this._setUpAddress(data);

var param={

url: '地址',, , 数据:数据,

sCallback:函数(res){

回调 && 回调(true,res);

},eCallback(res){

回调 &&callback(false,res);

}

};

this.request(param);

}

}

/*就这样结算吧*/C. ) {

var centerCitys=['北京市','天津市','上海市','重庆市'],

flag=centerCitys.indexOf(name) >= 0;♾turn ;

}

/*

*根据省市县信息编译地址数据

*域名，查询时所在省份

*/

setAddressInfo(res){

var省=res.provinceName || res.province,

city =res.cityName || res.城市，

国家=res.countyName || res .country,

detail =res.detailInfo || res.detail;

var totalDetail=city+country+detail;

console.log(res);

//直辖市，提取省份部分

C.县(!) ) {

totalDetail=省+totalDetail;

};

返回totalDetail;

}

}

}

} 港口