1、為什麼會有小程式
背景:更好的體驗和規範與管理
2、什麼是小程式小程式是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想。
使用者掃一掃或者搜一下即可開啟應用,也體現了“用完即走”的理念。
使用者不用憨是否安裝太多應用的問題。應用將無處不在,隨時可用,但又“無需安裝解除安裝”。
3、小程式與應用程式的區別無需安裝
不佔記憶體
易傳播
零售小程式:拼多多 京東 蘑菇街 小米商城
遊戲/娛樂小程式:跳一跳 歡樂鬥地主 歡樂麻將 鬥魚直播
5、小程式開發準備工作註冊小程式賬號->啟用郵箱->資訊登記->登入小程式管理後臺->完整小程式資訊->繫結開發者
6、安裝開發者工具官網下載
預演版本->開發版本->體驗版本->稽核版本->線上版本
開發版本也可以直接到稽核版本
7、小程式程式碼結構與基本配置app.js:
每個小程式都需要在 app.js 中呼叫 App 方法註冊小程式例項,繫結生命週期回撥函式、錯誤監聽和頁面不存在監聽函式等。
整個小程式只有一個 App 例項,是全部頁面共享的。開發者可以通過 getApp 方法獲取到全域性唯一的 App 例項,獲取App上的資料或呼叫開發者註冊在 App 上的函式。
app.json小程式根目錄下的 app.json 檔案用來對微信小程式進行全域性配置,決定頁面檔案的路徑、視窗表現、設定網路超時時間、設定多 tab 等。
每一個小程式頁面也可以使用同名 .json 檔案來對本頁面的視窗表現進行配置,頁面中配置項會覆蓋 app.json 的 window 中相同的配置項。
app.wxss小程式公共樣式表
pages用於指定小程式由哪些頁面組成,每一項都對應一個頁面的 路徑(含檔名) 資訊。檔名不需要寫檔案字尾,框架會自動去尋找對應位置的 .json, .js, .wxml, .wxss 四個檔案進行處理。
陣列的第一項代表小程式的初始頁面(首頁)。小程式中新增/減少頁面,都需要對 pages 陣列進行修改。
WXML:WeiXin Markup Language,構建頁面內容WXSS:WeiXin Style Sheets,用於描述頁面樣式WXS:WXML能力增強的指令碼語言,快速構建頁面內容結構JavaScript :互動邏輯、資料通訊
WXML:(WeiXin Markup Language)是框架設計的一套標籤語言,結合元件、WXS和時間系統,可以構建出頁面的結構。語法:<標籤名 屬性名="屬性名1" 屬性名="屬性名2" ... >
...
</標籤名>
標籤閉合、屬性名稱大小寫敏感
1)資料繫結 Mustache語法{{變數名/屬性/運算子}}
標籤屬性:
2)列表渲染
3)條件渲染
WXML 提供兩種檔案引用方式import和include。
importimport可以在該檔案中使用目標檔案定義的template,如:
在 item.wxml 中定義了一個叫item的template:
<import src="item.wxml"/><template is="item" data="{{text: 'forbar'}}"/>import 的作用域import 有作用域的概念,即只會 import 目標檔案中定義的 template,而不會 import 目標檔案 import 的 template。
如:C import B,B import A,在C中可以使用B定義的template,在B中可以使用A定義的template,但是C不能使用A定義的template。
尺寸單位rpx:響應式的畫素
樣式匯入-@import
內聯樣式-style
選擇器
優先順序
element->1
.element->10
#element->100
style->1000
!important->∞
WXS:(WeiXin Script),是對JS指令碼語言上層的封裝和限制,方便運算處理模組:對外不可見,exports暴露,require引入其他模組。
註釋:單行註釋、多行註釋、結尾註釋
支援的運算子:
語句:與JS基本一致,不支援try-catch語句資料型別:8種number、string、boolean、object、array、function、date、regexp。後兩種通過get使用,不能使用new
JavaScriptJavaScript是一種輕量的、解釋型的、面向物件的頭等函式語言,是一種動態的基於原型和多凡事的指令碼語言,支援面向物件、命令式和函式式的程式設計風格。
對比:
9、MINA框架詳解View檢視層、App Service邏輯層、Native系統層
檢視層和邏輯層獨立執行緒執行,通過JSBridge實現通訊。
10、小程式執行機制啟動啟動分冷啟動和熱啟動兩種,
熱啟動是已經開啟過之後一定時間內再次開啟。
主動銷燬:超過5分鐘或5s內多次告警
冷啟動遇到更新時會非同步載入,下次開啟才能應用。
載入10、生命週期程式生命週期頁面生命週期示例11、頁面路由頁面路由全部由框架來管理,共有6種路由方式:
路由觸發時機
12、小程式事件流
通過事件實現檢視層和邏輯層進行通訊。
最權威的學習文件: