小程序request接口的封装(本质上是对request回调函数再次回调)
-
module.exports.getData = function (url) {
-
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
var method = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'POST';
-
var header = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' };
-
return new Promise(function (resolve, reject) {
-
wx.request({
-
url: url,
-
data: data,
-
method: method,
-
header: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' },
-
success: function (res) {
-
resolve(res)
-
},
-
fail: function (res) {
-
reject(res)
-
}
-
})
-
})
-
}
调用方法
-
var common = require("../../common/common.js")
-
common.getData(postUrl)
-
.then(function(data){
-
this.setData({
-
//....
-
});
-
console.log(data);
-
});
二:实现给循环列表添加点击样式
微信小程序有个属性hover-class=’active’,是指当点击列表元素时当按下鼠标左键会显示active样式,但是鼠标离开样式就会复原.可以参考以下解决方案,直接上代码: wxml:
-
<view class="tags">
-
<view class="tag-title">标签</view>
-
<view class="tag-box">
-
<view wx:for="{{tags}}" wx:key="id" wx:for-index="i">
-
<view class="tags-item {{currentItem==item.id?'active-tag':''}}" data-id="{{item.id}}" bindtap="tagChoose">{{item.name}}</view>
-
</view>
-
</view>
-
</view>
js文件:
-
tagChoose:function(options){
-
var that = this
-
var id = options.currentTarget.dataset.id;
-
console.log(id)
-
//设置当前样式
-
that.setData({
-
'currentItem':id
-
})
-
}
核心点:class=”tags-item {{dateCurrent==item.id?’active-tag’:”}}”模板文件中使用三元运算符,通过dateCurrent指定当前item的id