258资源分享网

前言2016年9月21日晚间，微信公众平台开始陆续对外发送小程序内测邀请。此时，便对微信小程序有了关注，打算学习、并开发一款小程序。期间因为有其他项目开发的原因，稍有中断 ...

 
》》》前言

2016年9月21日晚间，微信公众平台开始陆续对外发送小程序内测邀请。此时，便对微信小程序有了关注，打算学习、并开发一款小程序。期间因为有其他项目开发的原因，稍有中断，然在前些天，终于将小程序的初版发布，并审核通过，下面文章中会把我在开发这个图片类小程序（不含上传图片功能）中遇到的一些坑与大家讲解，并附上解决途径。

》》》遇到的坑

（1）获取城市地理位置及具体位置 
需求：根据微信小程序自带的wx.getLocation(OBJECT)，获取用户所在具体位置及城市信息。 
解决思路：推荐使用百度地图的api来获取地理位置信息。 
具体流程可参考微信小程序的百度地图获取地理位置 —— 微信小程序教程系列（15） 
上面例子已测试成功。 
开发的大牛还是很多的，我在此基础上再补充几点： 
①调用此处的api，只需要有百度账号即可，在配额不够的情况下，可申请认证，具体可查看《认证开发者权益》； 
②在调用wx.getLocation(OBJECT)时，会弹出“是否获取地理位置”，要考虑用户在不允许获取地理位置的时候，设置一个默认经纬度； 
③附上一个官方的js下载地址：点击这里

（2）下拉及刷新的实现 
需求：根据接口获取第一页数据，下拉后重新获取第一页数据，上拉后可以获取第二页，第N页数据。 
解决思路：现有两种方法： 
方法一：利用page的”onPullDownRefresh”和”onReachBottom”， 
方法二在scroll-view里设定bindscrolltoupper和bindscrolltolower，大家可以根据自己的实际开发情况选用，讲解一下区别：

①方法一和方法二是冲突的，130400版本更新导致下拉刷新和scroll-view不能同时使用，只能选择一个； 
②在现在的版本中，方法一的onPullDownRefresh会自带下拉刷新动作，方法二没有； 
③方法二的scroll-view可以自带参数传递到js中，方法一如果下拉要带参数需要data中设值，下面的代码会有体现。

代码实现：

// 下拉重新加载照片信息

onPullDownRefresh:function(){

this.setData({

items:[],

personalCurPage:1

});

var that =this;

common.showTip("刷新中...","loading",800);

var userId = wx.getStorageSync('userId');

// 如果用户已登录

if(userId !=null&& userId >0){

api.getShooterNewestPics(that, userId,1);

}

},

// 上拉加载下一页

onReachBottom:function(event){

var that =this;

var curPage = that.data.personalCurPage;

curPage++;

this.setData({

hidden:false,

personalCurPage: curPage

});

var userId = wx.getStorageSync('userId');