微信小程序开发中走过的坑(一)：获取城市地理位置及具体位置，下拉及刷新的

 
》》》前言

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中设值，下面的代码会有体现。

代码实现：

1. // 下拉重新加载照片信息
2. onPullDownRefresh: function () {
3. this.setData({
4. items: [],
5. personalCurPage: 1
6. });
7. var that = this;
8. common.showTip("刷新中...", "loading", 800);
9. var userId = wx.getStorageSync('userId');
10.  
11. // 如果用户已登录
12. if (userId != null && userId > 0) {
13. api.getShooterNewestPics(that, userId, 1);
14. }
15. },
16.  
17. // 上拉加载下一页
18. onReachBottom: function (event) {
19. var that = this;
20. var curPage = that.data.personalCurPage;
21. curPage++;
22. this.setData({
23. hidden: false,
24. personalCurPage: curPage
25. });
26. var userId = wx.getStorageSync('userId');
27. common.showTip("加载中...", "loading", 500);
28. api.getShooterNewestPics(that, userId, curPage);
29. },

今天暂时讲这两点，下次继续。  有兴趣可以查看查看线上例子：