微信小程序框架分析小練手（二）——天氣微信小程序製做

簡單的天氣微信小程序。

1、首先，打開微信開發者工具，新建一個項目：weather。以下圖：

 

 

2、進入app.json中，修改導航欄標題爲「貴州天氣網」。

 

 

3、進入index.wxml，進行當每天氣狀況的界面佈局，包括溫度、最低溫度和最高溫度、天氣狀況、城市、星期、風向狀況。以下圖：

 

 

4、進入index.js，在data裏提供天氣數據，讓這些數據在界面裏顯示出來：

 

 

5、進入index.wxml，將data裏提供的天氣數據綁定到頁面裏：

 

 界面效果以下：

 

 6、進入index.wxss，爲index.wxml添加樣式，美化界面：

 

 

 

 至此，就簡單地把數據綁定到頁面中，並添加樣式後顯示出來：