1. 程式人生 > >微信小程式學習筆記 ( 小程式主體學習 二 邏輯層 app.js 擴充套件 高階食用方法)

微信小程式學習筆記 ( 小程式主體學習 二 邏輯層 app.js 擴充套件 高階食用方法)

目錄結構

文字結構
上圖是我建立的的微信小程式的目錄結構

主體學習

邏輯層(App Service)

   小程式開發框架的邏輯層由 JavaScript 編寫。
   邏輯層將資料進行處理後傳送給檢視層,同時接受檢視層的事件反饋。
   在JavaScript 的基礎上,我們做了一些修改,以方便地開發小程式。
    ¤ 增加AppPage方法,進行程式和頁面的註冊。
    ¤ 增加getAppgetCurrentPages 方法,分別用來獲取 App 例項和當前頁面棧。
    ¤ 提供豐富的API,如微信使用者資料,掃一掃,支付等微信特有能力。
    ¤ 每個頁面有獨立的作用域,並提供模組化能力。
    ¤ 由於框架並非執行在瀏覽器中,所以JavaScript 在 web 中一些能力都無法使用,如 document

window 等。
    ¤ 開發者寫的所有程式碼最終將會打包成一份JavaScript,並在小程式啟動的時候執行,直到小程式銷燬。類似 ServiceWorker,所以邏輯層也稱之為 App Service。

app.js 提升

先表明下什麼是高階食用,其實也沒什麼高階的,就是說,原本的食用是直接煮或者烤,體現不了我們中華飲食文化的厲害之處,所以其實這份更像是對前文的補充,一些擴充套件, 加點米油鹽,更好吃點..把自己說餓了
好了言歸正傳

onLaunch()

可支援欄位
onLaunch欄位
上圖就是官方的解釋好的下來我要給出我的理解,
其實剛看到這個引數詳表的時候我是懵逼的, 怎麼可能啊, js的傳參我不知道是要說優秀還是睿智(失了智),直接宣告…如 function fun(a,b,c){}

,這個就OK了,我們會很懵逼我去這個什麼玩意,更重要的對於外界來說傳參也是一個問題, 所以js對api的需求我個人感覺比java強多啦,js是真的你沒api就混不下去的,除非百度,要不看原始碼(666), 最重要的是java還有介面是吧,你js怎麼辦,微信你怎麼去約束開發者,難道說必須要按順序走…恐怖,而且他們那裡程式碼的書寫也是問題, 在我在控制檯列印了資訊後我明白了,他傳來的是一個js物件,額文字是描述不明白的,我們上個圖
引數描述
我本來是想測試下path的於是我在函式的引數中寫了一個path, 之後我就在控制檯列印了這個path, 結果 發生了我意想不到的事情他列印了一個物件, 這個就很有意思了, 在看了裡面的物件後我就明白了, 當onLaunch()
中含有引數時,這時相當於將一個物件傳了過來, 說來也有趣, js的這個模擬物件我也是看著騰訊的LOL官網的js學會的, 雖然學的不怎樣, 但現在受教了, 我們看到裡面包含了path, query, scene ,現在我們大概明白了這三個欄位的意思了,


  1. path就是當前頁面的路徑,
  2. query 即為當前頁面的query(??)這個我也是不明白當前的意思,之後如果我有明白的話會補上的,
  3. scene 的話就是場景值, 表明當前頁面是什麼,應該是這個樣子,我也上網百度了, 但是沒找到具體的解釋,如果我明白的話會補上的,下面是場景值的解釋
    scene
    我們大概明白了這三個欄位都是當前頁面的屬性
    shareTicket 就是轉發的資訊

官方API的解釋為
   通常開發者希望轉發出去的小程式被二次開啟的時候能夠獲取到一些資訊,例如群的標識。現在通過呼叫 wx.showShareMenu 並且設定
   withShareTickettrue ,當用戶將小程式轉發到任一群聊之後,此轉發卡片在群聊中被其他使用者開啟時,可以在
   App.onLaunch()App.onShow 獲取到一個 shareTicket。通過呼叫 wx.getShareInfo()
介面傳入此 shareTicket 可以獲取到轉發資訊
目前我在列印的資訊中並沒有找到他估計是沒有用轉發吧,等以後有機會了讓我測試下再補充
shareTicket

至於後面的三個我也不知道怎麼獲得,等我學到後面要用的時候再補下,
下圖是在onShow()方法中的應用, 我同時也測試了referrerInfo 發現並沒有用,估計到以後用其他小程式調的時候就可以了.
onShow
至於官方文件中onPageNotFound()我並沒有找到用法以後再說

場景值

關於場景值我也沒什麼好說的, 給個官方的解釋

場景值ID 說明
1001 發現欄小程式主入口
1005 頂部搜尋框的搜尋結果頁
1006 發現欄小程式主入口搜尋框的搜尋結果頁
1007 單人聊天會話中的小程式訊息卡片
1008 群聊會話中的小程式訊息卡片
1011 掃描二維碼
1012 長按圖片識別二維碼
1013 手機相簿選取二維碼
1014 小程式模版訊息
1017 前往體驗版的入口頁
1019 微信錢包
1020 公眾號 profile 頁相關小程式列表
1022 聊天頂部置頂小程式入口
1023 安卓系統桌面圖示
1024 小程式 profile 頁
1025 掃描一維碼
1026 附近小程式列表
1027 頂部搜尋框搜尋結果頁“使用過的小程式”列表
1028 我的卡包
1029 卡券詳情頁
1030 自動化測試下開啟小程式
1031 長按圖片識別一維碼
1032 手機相簿選取一維碼
1034 微信支付完成頁
1035 公眾號自定義選單
1036 App 分享訊息卡片
1037 小程式開啟小程式
1038 從另一個小程式返回
1039 搖電視
1042 新增好友搜尋框的搜尋結果頁
1043 公眾號模板訊息
1044 帶 shareTicket 的小程式訊息卡片
1045 朋友圈廣告
1047 掃描小程式碼
1048 長按圖片識別小程式碼
1049 手機相簿選取小程式碼
1052 卡券的適用門店列表
1053 搜一搜的結果頁
1054 頂部搜尋框小程式快捷入口
1056 音樂播放器選單
1057 錢包中的銀行卡詳情頁
1058 公眾號文章
1059 體驗版小程式繫結邀請頁
1064 微信連Wi-Fi狀態列
1067 公眾號文章廣告
1068 附近小程式列表廣告
1069 移動應用
1071 錢包中的銀行卡列表頁
1072 二維碼收款頁面
1073 客服訊息列表下發的小程式訊息卡片
1074 公眾號會話下發的小程式訊息卡片
1077 搖周邊
1078 連Wi-Fi成功頁
1079 微信遊戲中心
1081 客服訊息下發的文字鏈
1082 公眾號會話下發的文字鏈
1089 微信聊天主介面下拉
1090 長按小程式右上角選單喚出最近使用歷史
1091 公眾號文章商品卡片
1092 城市服務入口
1095 小程式廣告元件
1096 聊天記錄
1097 微信支付簽約頁