前言

因為工作需要，最近學習了一下微信小程序，在此分享一下大概的流程。

強烈建議大家先去看微信小程序簡易教程：點我進入

起步

客戶端打開小程序的時候，就將代碼包下載到本地進行解析，首先找到了根目錄的 app.json ，知道了小程序的所有頁面。

在這個Index頁面就是我們的首頁，客戶端在啟動的時候，將首頁的代碼裝載進來，通過微信的機制，就渲染出來了頁面。

App({ onLaunch() { // 小程序啟動之后 觸發 }})

小程序在啟動的時候，首先通過 App() 定義的 App() 實例的 onLaunch  方法，這個方法是各個頁面共享的，當然還有更多的回調事件。

Page({ data: { text: 'init data', array: [{msg: '1'}, {msg: '2'}] }})

在頁面加載時，data這個屬性會提供給頁面使用，會以Json的形式返回給前端，然后我們可以試著把這個值渲染在頁面上。

<view>{{text}}</view><view>{{array[0].msg}}</view>

 小程序頁面中還有很多的方法，像 onReady() 當頁面加載妥當，可以進行交互的時候觸發，還有小程序被切入后臺的 OnHide() 事件。當然這些都是應用級的事件，還有一些和用戶親密交互的事件，官方稱這種叫做頁面事件處理函數。

像最操蛋的是微信小程序沒有下拉事件 onPullDownRefresh() ，這個東西自己搞，我也是福氣了，不過也對，這東西解耦，就當我剛才說的是放屁。。。例如以下代碼。

在.json文件里設置 "enablePullDownRefresh": true,用于開啟頁面下拉加載效果，可以當前頁設置也可以全局設置；

{　　//當前頁 "enablePullDownRefresh": true //當前頁 "backgroundTextStyle": "dark" //頂部顯示顏色為深色的三個點}

 "window": { //全局 "enablePullDownRefresh": true //全局 "backgroundTextStyle": "dark" //頂部顯示顏色為白色的三個點 }

然后在某個頁面的js中，去寫一個下拉事件，然后例如這樣的。

onPullDownRefresh:function(){ var that = this; that.setData({  currentTab: 0 //當前頁的一些初始數據，視業務需求而定 })　　　　wx.startPullDownRefresh()；this.onLoad(); //重新加載onLoad() console.log('i am refreshing....'); }