續上文的開發指南：
這篇主要是講一下天氣主頁面的設計實現。
weatherdata所以天氣頁面直接取這兩個全域性資料就可以了。air
主頁面獲取天氣資料的**
//獲取天氣
getweather:function
(e);
//發出請求
wx.request(,
success: function
(res) );}})
},getair: function
(e);
//發出請求
wx.request(,
success: function
(res) );}})
},
weather.wxml設計
class="type">} | 空氣 }view>
view>
class="curextern">
class="wind">
class="">}view>
wx:if="}"
class="val">}2級
view>
wx:else
class="val">}級view>
view>
class="line">
view>
class="relwet">
class="">相對濕度view>
class="val">}%view>
view>
class="line">
view>
class="humantmp">
class="">體感溫度view>
class="val">}°view>
view>
view>
view>
class="forecast">
wx:for="}"
wx:for-index="index"
wx:for-item="fc">
class="castitem">
class="castday">}view>
class="casttype">
class="typeimg"
src="../../images/weather/}.png">
image>
} | }
view>
class="casttmp">
}° / }°
view>
view>
block>
view>
view>
weather.wxss設計
/**index.wxss**/
.curweather
.bg.curtemperature
.tmp
.curextern
.val
.line
.typeimg
.castitem
.forecast
//獲取應用例項
page(,
onshow: function
() );
that.getweather(city);//獲得天氣
},//當頁面載入完成
onload: function
() );
console.log(this.data.showday);
},//獲取天氣
getweather: function
(city) );
},});
微信小程式頁面布局
3.flex布局的主要特徵是能夠調整其子元素在不同的螢幕大小中能夠用最適合的方法填充合適的空間。二,flex布局的特點 1.任意方向的伸縮，向左，向右，向下，向上 2.在樣式層可以調換和重排順序 3.主軸和側軸方便配置 4.子元素的空間拉伸和填充 5.沿著容器對齊23 顯示效果 block改換成di...
微信小程式頁面布局
1.flex布局，是w3c在2009年提出的一種新的方案，可以簡便，完整，響應式的實現各種頁面布局。2.flex布局提供了元素在容器中的對齊，方向以及順序，甚至他們可以是動態的或者不確定的大小的。3.flex布局的主要特徵是能夠調整其子元素在不同的螢幕大小中能夠用最適合的方法填充合適的空間。二,fl...
微信小程式頁面跳轉
每乙個列表對應著都有乙個詳情頁面，那麼這個詳情頁面可以通過乙個標籤去跳轉，也就是用上述的標籤就可以數顯跳轉 那麼對應列表裡面的詳情頁我們還需要在這個鏈結上進行乙個操作。也就是在鏈結後面 新增乙個對應的id引數，然後js裡面去接受這個引數，就會根據資料來跳轉到對應的詳情頁去了。exports.gets...