微信小程序开发——天气预报项目的问题与坑点

问题1：在新页面中切换城市时，如何把新城市的信息带回到首页中去？

解决方案：在切换城市的JS文件中添加如下字样

var pages = getCurrentPages();
var currPage = pages[pages.length - 1];   //当前页面
var prevPage = pages[pages.length - 2];  
prevPage.setData({
          latitude: res.latitude,
          longitude : res.longitude
})
wx.navigateBack({
          delta: 1,//回到上一个页面
})

 首先，获取所有页面信息，系统默认的，最后一个页面信息就是当前切换城市的页面，那么我们要只需回到上一个页面，即天气预报首页，进行prevPage.setData操作，更新经纬度即可。

 

问题2：为什么在真机预览加载不出来页面，但是真机调试可以？

解决方案：由于本人一开始选择使用测试号进行开发，所以在调取API的时候，勾选了不校验合法域名的选项。但是预览的话，手机默认是校验的，所以需要在手机扫描预览的二维码，打开小程序后，点击右上角的三个点，然后点击打开调试即可。

 

问题3：scroll-view（可滚动视图区域）的初次使用？

解决方案：scroll-view竖向滚动容易实现，但是横向滚动比较麻烦。

    display: flex;

其中最重要的肯定是将其设为弹性布局，其次是配合循环语句使用。

 

问题4：为什么刚开始进入小程序时加载较慢，以至于可以看到一些数值还没赋值之前的样子？

未解决此问题，猜想是因为调取API部分的代码写的十分烂，导致时间复杂度过大。

 

问题5：拿到新地址的经纬度，然后呢？

解决方案：如果只是把新地址的经纬度传回到天气预报的首页上，天气是不会变的，这里我添加了onShow函数，虽然一开始打开小程序也是触发了onshow，但是由于经纬度都还没赋值，所以后续操作不能进行（可能是这里变慢了？）；而赋值了新地址之后回到首页上触发了onshow函数，此时经纬度已经是新地址的值了，再次调取API就可以得到新地址的天气。

 

问题6：美观问题？

解决方案：初次开发，直接就找了个好看的天气预报小程序，学习别人的布局和排版。

 

坑点1：跳转新页面时这样写是错误的

/pages/search/search.wxml

 这样写才是正确的

/pages/search/search

 

坑点2：使用图片时这样写是错误的

src="../../tianqi/weather-icon-S1/color-64/“+{{item.iconDay}}+”.png"

  这样写才是正确的

src="../../tianqi/weather-icon-S1/color-64/{{item.iconDay}}.png"

 

坑点3：尽量使用iPhone6作为模拟器，因为 px 换算成 rpx比较好算

 

天气预报项目END。。。