一、小程式在建好專案之後會出現如圖1-1中顯示的基本檔案

a) 其中pages 是存放小程式頁面的地方

b) utils是存放小程式工具的地方也就是功能API，可以有很多個JS檔案每個JS分別儲存著不同功能的API

c) app.js 是小程式的入口檔案在小程式執行時最先執行的是APP.JS

d) app.json 是小程式的配置檔案

e) app.wxss 是小程式的CSS檔案

圖1-1 (注: 此圖片可放大縮小)

二、APP.JS內容如圖1-2

a) 在app.js中的函式是全域性函式

b) 其中onLaunch 是小程式的內建函式，當小程式初始化完成時，會觸發 onLaunch （全域性只觸發一次）

c) getUserInfo 會在頁面載入完成之後執行用來獲取使用者資訊

d) globalData: 此物件為小程式的全域性資料可以在任意頁面呼叫

圖1-2 (注: 此圖片可放大縮小)

三、App.json 檔案 如圖 1-3

a) pages 陣列中存放在所以小程式頁面路徑，其中路徑的根目錄為pages(注:所有的小程式頁面路徑都要在裡面但不要字尾名)

b) 在pages 中的第一個配製頁面為預設的主頁

c) window這個配製選項裡是用來配製視窗資訊

圖1-3 (注: 此圖片可放大縮小)

四、app.wxss 此檔案裡的樣式為所有小程式頁面公用部分.......................

五、在pages 中有如圖2-1所示有兩個頁面一個為主頁也就是配製檔案中的第一個文 件index  第二個為logs是小程式日誌檔案

圖2-1 (注: 此圖片可放大縮小)

六、在存放頁面的資料夾中有如圖2-2所示

a) 其中所有的檔名都需要跟資料夾一樣

b) 其中js  是負責處理邏輯部分，wxml是頁面結構部分,wxss是樣式表示部分

圖2-2 (注: 此圖片可放大縮小)

七、在index.js,index.wxml,wxss檔案中有如圖2-3,2-4,2-5所示

a) 其中所有的檔名都需要跟資料夾一樣

b) 在index.js中可以通過getApp();獲取app.js中的方法與函式

c) Page 裡可以設定本頁面中的相關的方法與資料

e) bindViewTap 是一個方法函式可以在本頁面中呼叫方法名來執行此方法

f) 在圖2-4中通過bindtap 綁定了此函式在點選時會執行函式裡的內容

g) onLoad 此方法是在頁面載入完成之後執行的函式在函式裡可以接收一個引數，此引數為連結地址中的問號以後的內容此引數在填寫是需要注意內容中不得帶隱號。

h) 在小程式中更新資料有其獨特的機制setData();是小程式提供的更新內容資料的方法

i) wx.navigateTo({url: ‘../logs/logs’}); 此方法是用來指向當前跳轉地址的;

圖2-3 (注: 此圖片可放大縮小)

圖2-4 (注: 此圖片可放大縮小)

圖2-5 (注: 此圖片可放大縮小)

八、常用的API及元件介紹

Navigator 導航標籤

能夠設定標題連結可以設定多個屬性如圖3-1，3-2所示

圖3-1 (注: 此圖片可放大縮小)

圖3-2 (注: 此圖片可放大縮小)

設定低部導航如圖3-3所示

tabBar第一項路徑必需與pages中的第一樣路徑一致

 具休詳情請參照小程式API地址