国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

微信小程序開發(fā)教程(基礎(chǔ)篇)6-logs頁面解析

shiguibiao / 2860人閱讀

摘要：到此為止，默認(rèn)生成程序的解析部分就結(jié)束了。這個(gè)解析過程是為了對(duì)微信小程序有個(gè)總體上的理解，所以很多地方并沒有深入。在后面的教程中，我會(huì)繼續(xù)講解微信小程序開發(fā)的各個(gè)方面。

上一篇教程中對(duì)index頁面進(jìn)行了解析，這一篇來解析下logs頁面

老規(guī)矩先上圖

該頁面包含返回按鈕(用于返回index頁面)，頁面title和程序啟動(dòng)日志列表。
和index頁面相比，logs頁面多了一個(gè)logs.json文件，來配置頁面title的內(nèi)容

{
    "navigationBarTitleText": "查看啟動(dòng)日志"
}

更多配置項(xiàng)可以參考配置 小程序



  
    {{index + 1}}. {{log}}

在logs.wxml中，定義了三個(gè)標(biāo)簽，分別為view，block和text，其中view標(biāo)簽為容器，block用于綁定logs數(shù)組，而text標(biāo)簽用于顯示每一條log。wx:for和wx:for-item是小程序框提供的列表綁定語法，更多詳情請(qǐng)參考列表渲染

//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方法中從本地緩存中獲取程序啟動(dòng)時(shí)間數(shù)據(jù)，之后調(diào)用數(shù)組的map方法來將時(shí)間格式化為字符串

.log-list {
  display: flex;
  flex-direction: column;
  padding: 40rpx;
}
.log-item {
  margin: 10rpx;
}

最后仍然是logs.wxss，對(duì)頁面樣式進(jìn)行控制。

到此為止，默認(rèn)生成程序的解析部分就結(jié)束了。這個(gè)解析過程是為了對(duì)微信小程序有個(gè)總體上的理解，所以很多地方并沒有深入。在后面的教程中，我會(huì)繼續(xù)講解微信小程序開發(fā)的各個(gè)方面。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/81062.html

相關(guān)文章

  • 微信小程序開發(fā)教程(基礎(chǔ)篇)5-index 頁面解析

    摘要：上一篇教程談了些和微信小程序開發(fā)本身無關(guān)的技術(shù)問題，現(xiàn)在回到主題。這邊教程主要對(duì)默認(rèn)生成的頁面進(jìn)行講解。而的顯示則是由屬性直接指定。在該例子中，當(dāng)用戶點(diǎn)擊用戶頭像和昵稱的視圖區(qū)域時(shí)，程序便會(huì)顯示頁面。 上一篇教程談了些和微信小程序開發(fā)本身無關(guān)的技術(shù)問題，現(xiàn)在回到主題。 這邊教程主要對(duì)默認(rèn)生成的index 頁面進(jìn)行講解。在之前的教程中有寫道，每一個(gè)頁面都包含.js(處理邏輯)，.wxml...

    GT 評(píng)論0 收藏0

  • 微信小程序開發(fā)教程(基礎(chǔ)篇)3-app.js 解析

    摘要：微信小程序框架提供了一系列來幫助我們進(jìn)行本地?cái)?shù)據(jù)存儲(chǔ)，上面的代碼中使用到了和兩個(gè)更多相關(guān)可以參考這里方法很容易理解，會(huì)執(zhí)行獲取用戶信息的功能。 上一篇教程中寫道，開發(fā)工具會(huì)生成一個(gè)默認(rèn)的程序框架，其中程序的主流程代碼包含在app.js中。默認(rèn)實(shí)現(xiàn)中，該部分功能比較簡(jiǎn)單，不過對(duì)于學(xué)研究小程序開發(fā)還是比較有價(jià)值的。 由于代碼行數(shù)不多，下面一次性貼出來后進(jìn)行講解 //app.js App({...

    lemon 評(píng)論0 收藏0

  • 微信小程序開發(fā)教程(基礎(chǔ)篇)2-微信小程序結(jié)構(gòu)概覽

    摘要：在新建一個(gè)項(xiàng)目后，微信小程序會(huì)生成一個(gè)默認(rèn)的程序框架，后續(xù)程序的開發(fā)工作都在這個(gè)框架上進(jìn)行。微信小程序的開發(fā)模式確實(shí)和開發(fā)很相似。通常一個(gè)完整的微信小程序包含上面兩部分，當(dāng)然我們也可以定義自己的目錄用于存放公共代碼和程序需要的其它文件。 在上一篇教程的最后，我們生成了一個(gè)類似Hello World的小程序，這個(gè)過程中沒有編寫任何一行代碼。在新建一個(gè)項(xiàng)目后，微信小程序會(huì)生成一個(gè)默認(rèn)的程序...

    muddyway 評(píng)論0 收藏0

  • 微信小程序開發(fā)教程(基礎(chǔ)篇)7-數(shù)據(jù)綁定上

    摘要：在之前的教程中寫到，微信小程序框架將程序分為邏輯層文件和視圖層文件。關(guān)于數(shù)據(jù)綁定的更多講述，敬請(qǐng)期待微信小程序開發(fā)教程基礎(chǔ)篇數(shù)據(jù)綁定下 在之前的教程中寫到，微信小程序框架將程序分為邏輯層(.js文件)和視圖層(.wxml文件)。這是一種常見的UI和邏輯分離的程序設(shè)計(jì)方式，開發(fā)出來的程序更加靈活，易擴(kuò)展。 這種程序設(shè)計(jì)方式通常要解決兩個(gè)問題: UI層響應(yīng)邏輯層邏輯和數(shù)據(jù)的變化UI層將用戶...

    I_Am 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<