<center id="4kmqu"><code id="4kmqu"></code></center><strike id="4kmqu"></strike>

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

lemon 發布于2019-08-20 12:23 / 1912人閱讀

摘要：微信小程序框架提供了一系列來幫助我們進行本地數據存儲，上面的代碼中使用到了和兩個更多相關可以參考這里方法很容易理解，會執行獲取用戶信息的功能。

上一篇教程中寫道，開發工具會生成一個默認的程序框架，其中程序的主流程代碼包含在app.js中。默認實現中，該部分功能比較簡單，不過對于學研究小程序開發還是比較有價值的。

由于代碼行數不多，下面一次性貼出來后進行講解

//app.js
App({
  onLaunch: function () {
    //調用API從本地緩存中獲取數據
    var logs = wx.getStorageSync("logs") || []
    logs.unshift(Date.now())
    wx.setStorageSync("logs", logs)
  },
  getUserInfo:function(cb){
    var that = this
    if(this.globalData.userInfo){
      typeof cb == "function" && cb(this.globalData.userInfo)
    }else{
      //調用登錄接口
      wx.login({
        success: function () {
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo
              typeof cb == "function" && cb(that.globalData.userInfo)
            }
          })
        }
      })
    }
  },
  globalData:{
    userInfo:null
  }
})

代碼中定義了一個App對象，該對象包含onLaunch, getUserInfo兩個方法和globalData成員變量其中onLaunch方法會在程序啟動時由框架來進行調用。在該方法中，程序通過微信提供的本地存儲接口獲取了一個logs變量，第一次獲取時會返回空，這時將變量初始化為空數組。之后在數組頭部添加一個格式化的時間字符串，之后將數組變量存儲在本地。

微信小程序框架提供了一系列api來幫助我們進行本地數據存儲，上面的代碼中使用到了wx.getStorageSync和wx.setStorageSync兩個api,更多相關api可以參考這里

getUserInfo方法很容易理解，會執行獲取用戶信息的功能。不過該方法不同于onLaunch,它不是框架預設的函數，因此不會自動觸發調用。該方法是在index.js的onload方法中調用的(關于index.js部分會在后續教程中講解)。該方法需要調用者傳遞一個名為cb的參數，首先判斷是否獲取過用戶信息，如果獲取過并且cb是函數的話，就會調用cb函數并將globalData成員變量傳遞進去，否則將調用wx.login接口來獲取用戶信息。

對js不熟悉或者很少接觸腳本語言的同學可能會對上述代碼的語法產生困惑，這幾行代碼涉及到了函數回調，匿名函數，閉包等概念，我后續會針對這部分多帶帶寫一篇教程。

代碼最后定義了 globalData成員變量，該成員包含userInfo變量，用來保存用戶信息。

GPU云服務器云服務器購物微信小程序開發視頻教程微信小程序開發微信小程序開發語言微信小程序開發免費

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/80959.html

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

摘要：到此為止，默認生成程序的解析部分就結束了。這個解析過程是為了對微信小程序有個總體上的理解，所以很多地方并沒有深入。在后面的教程中，我會繼續講解微信小程序開發的各個方面。上一篇教程中對index頁面進行了解析，這一篇來解析下logs頁面老規矩先上圖 showImg(https://segmentfault.com/img/remote/1460000007613022?w=378&h...

shiguibiao 2019-08-20 12:34 評論0 收藏0
微信小程序開發教程(基礎篇)5-index 頁面解析

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

GT 2019-08-20 12:29 評論0 收藏0
微信小程序開發教程(基礎篇)2-微信小程序結構概覽

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

muddyway 2019-08-20 12:21 評論0 收藏0
前端資源系列（3）-微信小程序開發資源匯總

摘要：微信小程序應用號開發資源匯總文檔工具教程代碼插件組件文檔從搭建一個微信小程序開始小程序開發文檔小程序設計指南工具小程序開發者工具官方支持微信小程序實時預覽的支持的微信小程序組件化開發框架轉在線工具小程序云端增強社區微信小程序微信(小程序or應用號)開發資源匯總-文檔-工具-教程-代碼-插件-組件文檔從搭建一個微信小程序開始小程序開發文檔小程序設計指南工具小程序開發者...

paney129 2019-08-20 11:14 評論0 收藏0