小程式開發十問

CPPAlien發表於2018-05-11

小程式開發十問

第一問:小程式頁面間如何傳遞資料?

A 跳轉到 B 時,可以通過 url 中 query 傳遞資料。

B 頁面 onLoad(options) 方法中的 options 會包含 query 中的 key-value 的內容。

如果需要傳遞如 json 或陣列這樣的結構化資料,我們可以先把結構化資料做 string 化和 encode 一下後,再通過該方式傳遞。

encodeURIComponent(JSON.stringify(xxx))
複製程式碼

在 B 頁面中,獲得內容後,通過以下方法,解析出資料。

JSON.parse(decodeURIComponent(xxx))
複製程式碼

第二問:頁面間如何回傳資料?

比如 A 開啟了 B,B 中一些資料需要傳送到 A。可以先獲取前一個頁面例項,然後直接呼叫前一個頁面方法進行資料傳輸。

const pages = getCurrentPages();
const prevPage = pages[pages.length - 2];
prevPage.methodOfPrevPage(data);
複製程式碼

第三問:小程式如何與服務端保持會話?

因小程式框架並無 Cookie 管理機制,並且小程式也未提供向 WebView 設定 Cookie 的方法。所以如果我們想繼續使用 Session-Cookie 機制,則需要自己實現一套,我們可以簡單的提取出 set-cookie 頭中有效的 cookie 內容,然後儲存在記憶體和本地中,在下一次請求的時候,把這些 cookie 組裝起來使用。當涉及到 WebView 時,我們可以通過 query 的方法,把這些 Cookie 內容傳給 Web 端,用來維持和服務端的有效會話。

當然你也可以採用 Token 機制,與服務端保持會話。

第四問:如何呼叫子元件中的方法?

我們可以在自定義元件中加上一個 id,然後在 js 程式碼中使用如下方法:

this.selectComponent('#id').methodOfComponent(data);
複製程式碼

第五問:子元件中如何呼叫父元件的方法?

使用元件事件方法,詳細文件:《元件事件文件》

在父元件中使用子元件時,可以定義一個

bind:customMethod='parentMethod'
複製程式碼

然後子元件中,可以使用以下程式碼呼叫父類的方法

this.triggerEvent('customMethod', data);
複製程式碼

第六問:小程式如何進行資料分析?

小程式後臺提供了資料分析能力,具體可見:《小程式資料分析文件》

並且如果需要把資料接入到自己的服務中,也可以通過呼叫微信介面的方式拿到資料:《小程式資料分析介面文件》

如果需要自定義資料,我們可以在小程式中呼叫方法:

wx.reportAnalytics(eventName, data)
複製程式碼

不過在使用前,需要在小程式管理後臺自定義分析中新建事件,配置好事件名與欄位。另外自定義事件的資料無法通過介面獲得,

所以如果你需要在自己的伺服器上也分享自定義事件,那隻能自己開發幾個介面了。

第七問:微信小程式的二維碼生成有次數限制嗎?

微信提供了三種方式生成微信二維碼,詳情可檢視:《小程式二維碼相關文件》

此三種型別二維碼都需要服務端端通過 access_token 呼叫微信介面生成。並且其中 介面B僅能生成已釋出的小程式頁面的二維碼,所以你的小程式先得上線後才能測試該功能。有點坑。

其中介面A、和介面C有次數限制,介面A加上介面C,總共生成的碼數量限制為100,000。

介面 B 次數無限制,但呼叫頻率有限制,5000次/分鐘。

介面 A 和介面 C 相對介面 B 可以傳入一個最大長度不超過 128 位元組的 path,你可以在 path 中通過 query 的形式傳入引數。

介面 B 相對 A、C,把 PATH 拆成了,page 和 scene,其中 scene 最大為 32 個字元。可以在 page 的 onLoad 方法中通過 options.scene 方式獲得這個 scene。

第八問:普通二維碼可以開啟小程式嗎?

可以,需要在小程式管理後臺新增,新增後,即可掃描以下內容的二維碼就可跳轉到小程式的指定頁面了。

詳情可檢視:《小程式普通二維碼文件》

小程式開發十問

第九問:小程式版本的相容情況如何?

小程式執行在微信上,並且小程式的基礎庫隨微信版本而發版。所以不同的微信版本會對小程式的表現有所影響。 有關各個版本的基礎庫的覆蓋率可以檢視以下連結。 《小程式基礎庫版本介紹》

目前微信推薦的最低基礎庫版本,可以覆蓋 80% 以上的微信使用者。另外低版本的微信在使用使用高基礎庫版本的小程式會提示升級微信。

第十問:小程式程式碼可以執行在瀏覽器中嗎?

小程式使用的是自己的一套框架,只是借用了目前主流的 html + js + css 的開發形式,所以小程式程式碼本身是無法直接執行在瀏覽器中的。

目前美團開源了一套自己的方案:mpvue ,使用 vue 的形式來編寫小程式。並且可以通過改變打包配置的方式,讓同一套程式碼可以同時執行在小程式和瀏覽器中。

最近在公司做了幾款小程式,對小程式開發有了一些經驗,如果你對小程式開發有更多疑問,可以加入小程式開發者交流微信群,一起交流學習。

相關文章