上一篇教程中對index頁面進行了解析嘁傀，這一篇來解析下logs頁面
老規(guī)矩先上圖
logs頁面
該頁面包含返回按鈕(用于返回index頁面)外冀，頁面title和程序啟動日志列表贩疙。
和index頁面相比诀诊，logs頁面多了一個logs.json文件洞渤，來配置頁面title的內(nèi)容
{
"navigationBarTitleText": "查看啟動日志"
}
更多配置項可以參考配置 小程序
<!--logs.wxml-->
<view class="container log-list">
<block wx:for="{{logs}}" wx:for-item="log">
<text class="log-item">{{index + 1}}. {{log}}</text>
</block>
</view>
在logs.wxml中，定義了三個標簽属瓣，分別為view载迄，block和text讯柔，其中view標簽為容器，block用于綁定logs數(shù)組护昧，而text標簽用于顯示每一條log魂迄。wx:for和wx:for-item是小程序框提供的列表綁定語法，更多詳情請參考列表渲染
//logs.js
var util = require('../../utils/util.js')
Page({
data: {
logs: []
},
onLoad: function () {
this.setData({
logs: (wx.getStorageSync('logs') || []).map(function (log) {
return util.formatTime(new Date(log))
})
})
}
})
logs.js定義了logs數(shù)組惋耙，并在onLoad方法中從本地緩存中獲取程序啟動時間數(shù)據(jù)极祸，之后調(diào)用數(shù)組的map方法來將時間格式化為字符串
.log-list {
display: flex;
flex-direction: column;
padding: 40rpx;
}
.log-item {
margin: 10rpx;
}
最后仍然是logs.wxss，對頁面樣式進行控制怠晴。
到此為止遥金，默認生成程序的解析部分就結(jié)束了。這個解析過程是為了對微信小程序有個總體上的理解蒜田，所以很多地方并沒有深入稿械。在后面的教程中，我會繼續(xù)講解微信小程序開發(fā)的各個方面冲粤。
