微信小程序新手教程之官方文檔BUG，tip及QA提示，本篇默認已經成功安裝微信小程序工具，來和小編一起看看吧

為了方便大家發(fā)現(xiàn)一些注意點，官方文檔中最近的一次更新1123版本時，增加了一些提示信息，我現(xiàn)在將這些信息集中一下，以便同學們查看;

特別說明：本bug及tip僅適用于0.10.112301及之前的版本，之后更新的版本請優(yōu)先對比官方文檔;

注冊程序：

注意：

App() 必須在 app.js 中注冊，且不能注冊多個。

不要在定義于 App() 內的函數中調用 getApp() ，使用 this 就可以拿到 app 實例。

不要在 onLaunch 的時候調用 getCurrentPage()，此時 page 還沒有生成。

通過 getApp() 獲取實例之后，不要私自調用生命周期函數。

注意：

直接修改 this.data 無效，無法改變頁面的狀態(tài)，還會造成數據不一致。

單次設置的數據不能超過1024kB，請盡量避免一次設置過多的數據。

Bug & Tip

bug: iOS/Android 6.3.30, 首次進入頁面，如果頁面不滿一屏時會觸發(fā) onReachBottom ，應為只有用戶主動上拉才觸發(fā);

bug: iOS/Android 6.3.30, 手指上拉，會觸發(fā)多次 onReachBottom ，應為一次上拉，只觸發(fā)一次;

模塊化

exports 是 module.exports 的一個引用，因此在模塊里邊隨意更改 exports 的指向會造成未知的錯誤。所以我們更推薦開發(fā)者采用module.exports 來暴露模塊接口，除非你已經清晰知道這兩者的關系。

小程序目前不支持直接引入 node_modules , 開發(fā)者需要使用到 node_modules 時候建議拷貝出相關的代碼到小程序的目錄中。

需要注意的是：

這種轉換只會幫助開發(fā)處理語法上問題，新的 ES6 的 API 例如 Promise 等需要開發(fā)者自行引入 Polyfill 或者別的類庫。

為了提高代碼質量，在開啟 ES6 轉換功能的情況下，默認啟用 javasctipt 嚴格模式，請參考 "use strict" 。

數據綁定

關鍵字(需要在雙引號之內)

true：boolean 類型的 true，代表真值。

false： boolean 類型的 false，代表假值。

特別注意：不要直接寫 checked="false"，其計算結果是一個字符串，轉成 boolean 類型后代表真值。

條件渲染

注意： 并不是一個組件，它僅僅是一個包裝元素，不會在頁面中做任何渲染，只接受控制屬性。

事件

注：除上表之外的其他組件自定義事件如無特殊申明都是非冒泡事件，如

的submit事件，的input事件，的scroll事件，(詳見各個組件)

特殊事件： 中的觸摸事件不可冒泡，所以沒有 currentTarget。

說明： target 和 currentTarget 可以參考上例中，點擊 inner view 時，handleTap3 收到的事件對象 target 和 currentTarget 都是 inner，而 handleTap2 收到的事件對象 target 就是 inner，currentTarget 就是 middle。

WXSS

建議： 開發(fā)微信小程序時設計師可以用 iPhone6 作為視覺稿的標準。 注意： 在較小的屏幕上不可避免的會有一些毛刺，請在開發(fā)時盡量避免這種情況。

scroll-view

tip: 請勿在 scroll-view 中使用 textarea、map、canvas、video 組件

tip: scroll-into-view 的優(yōu)先級高于 scroll-top

text

除了文本節(jié)點以外的其他節(jié)點都無法長按選中。

button

注：button-hover 默認為{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}

input

bug : 微信版本 6.3.30, focus 屬性設置無效;

bug : 微信版本 6.3.30, placeholder 在聚焦時出現(xiàn)重影問題;

tip : input 組件是一個 native 組件，字體是系統(tǒng)字體，所以無法設置 font-family;

tip : 在 input 聚焦期間，避免使用 css 動畫;

textarea

bug: 微信版本 6.3.30，textarea 在列表渲染時，新增加的 textarea 在自動聚焦時的位置計算錯誤

tip: 請勿在 scroll-view 中使用 textarea 組件

navigator

注：navigator-hover默認為{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}, 的子節(jié)點背景色應為透明色

image

注：image組件默認寬度300px、高度225px

canvas

canvas 標簽默認寬度300px、高度225px

同一頁面中的 canvas-id 不可重復，如果使用一個已經出現(xiàn)過的 canvas-id，該 canvas 標簽對應的畫布將被隱藏并不再正常工作

發(fā)起請求

bug: 開發(fā)者工具 0.10.102800 版本，header 的 content-type 設置異常;

tip: 客戶端的 HTTPS TLS 版本為1.2，但 Android 的部分機型還未支持 TLS 1.2，所以請確保 HTTPS 服務器的 TLS 版本支持1.2及以下版本;

tip: 要注意 method 的 value 必須為大寫(例如：GET);

tip: url 中不能有端口;

uploadFile

注：文件的臨時路徑，在小程序本次啟動期間可以正常使用，如需持久保存，需在主動調用 wx.saveFile，在小程序下次啟動時才能訪問得到。

saveFile

tip: 本地文件存儲的大小限制為 100M

setStorage

注意： localStorage 是永久存儲的，但是我們不建議將關鍵信息全部存在 localStorage，以防用戶換設備的情況。

tip: 本地數據存儲的大小限制為 5M

openLocation

bug: iOS 6.3.30 type 參數不生效，只會返回 wgs84 類型的坐標信息

showModal

bug: Android 6.3.30，wx.showModal 的返回的 confirm 一直為 true;

navigateTo

注意：為了不讓用戶在使用小程序時造成困擾，我們規(guī)定頁面路徑只能是五層，請盡量避免多層級的交互方式。

createAnimation

注意: export 方法每次調用后會清掉之前的動畫操作

bug: iOS/Android 6.3.30 通過 step() 分隔動畫，只有第一步動畫能生效

登錄

bug: iOS/Android 6.3.30，在 App.onLaunch 調用 wx.login 會出現(xiàn)異常

模板消息

注意：內部測試階段，模板消息下發(fā)后，在客戶端僅能看到由“公眾號安全助手”下發(fā)的簡單通知。能收到該提示，即表明模板消息功能已經調試成功。待該功能正式上線后，將可以展示成上圖效果。

下發(fā)條件說明

支付

當用戶在小程序內完成過支付行為，可允許開發(fā)者向用戶在7天內推送有限條數的模板消息(1次支付可下發(fā)1條，多次支付下發(fā)條數獨立，互相不影響)

提交表單

當用戶在小程序內發(fā)生過提交表單行為且該表單聲明為要發(fā)模板消息的，開發(fā)者需要向用戶提供服務時，可允許開發(fā)者向用戶在7天內推送有限條數的模板消息(1次提交表單可下發(fā)1條，多次提交下發(fā)條數獨立，相互不影響)

常用快捷鍵格式調整

Ctrl+S：保存文件

Ctrl+[， Ctrl+]：代碼行縮進

Ctrl+Shift+[， Ctrl+Shift+]：折疊打開代碼塊

Ctrl+C Ctrl+V：復制粘貼，如果沒有選中任何文字則復制粘貼一行

Shift+Alt+F：代碼格式化

Alt+Up，Alt+Down：上下移動一行

Shift+Alt+Up，Shift+Alt+Down：向上向下復制一行

Ctrl+Shift+Enter：在當前行上方插入一行

Ctrl+Shift+F：全局搜索

光標相關

Ctrl+End：移動到文件結尾

Ctrl+Home：移動到文件開頭

Ctrl+i：選中當前行

Shift+End：選擇從光標到行尾

Shift+Home：選擇從行首到光標處

Ctrl+Shift+L：選中所有匹配

Ctrl+D：選中匹配

Ctrl+U：光標回退

界面相關

Ctrl + ：隱藏側邊欄

Ctrl + m: 打開或者隱藏模擬器

微信支付

小程序支付開發(fā)步驟：https://pay.weixin.qq.com/wiki/d ... &index=1&t=20161122

官方QA

怎么獲取用戶輸入

能夠獲取用戶輸入的組件，需要使用組件的屬性bindchange將用戶的輸入內容同步到 AppService。

varinputContent = {}Page({ data: { inputContent: {} }, bindChange: function(e) { inputContent[e.currentTarget.id] = e.detail.value }})為什么腳本內不能使用window等對象

頁面的腳本邏輯是在JsCore中運行，JsCore是一個沒有窗口對象的環(huán)境，所以不能在腳本中使用window，也無法在腳本中操作組件

為什么 zepto/jquery 無法使用

zepto/jquery 會使用到window對象和document對象，所以無法使用。

wx.navigateTo無法打開頁面

一個應用同時只能打開5個頁面，當已經打開了5個頁面之后，wx.navigateTo不能正常打開新頁面。請避免多層級的交互方式，或者使用wx.redirectTo

樣式表不支持級聯(lián)選擇器

WXSS支持以.開始的類選擇器。如：

.normal_view { color: #000000; padding: 10px;}

可以使用標簽選擇器，控制同一類組件的樣式。如：使用input標簽選擇器控制的默認樣式。

input { width: 100px;}本地資源無法通過 css 獲取

background-image：可以使用網絡圖片，或者 base64，或者使用

標簽

如何修改窗口的背景色

使用 page 標簽選擇器，可以修改頂層節(jié)點的樣式

page { display: block; min-height: 100%; background-color: red;}為什么上傳不成功

為了提升體驗流暢度，編譯后的代碼包大小需小于 1MB ，大于 1MB 的代碼包將上傳失敗。

HTTPS 請求不成功

tls 僅支持 1.2 及以上版本

網絡請求的 referer

網絡請求的 referer 是不可以設置的，格式固定為 https://servicewechat.com/{appid}/{version}/page-frame.html，其中 {appid} 為小程序的 appid，{version} 為小程序的版本號，版本號為 0 表示為開發(fā)版。

嗨圖功能

1、專題——DIY圖片的模板，點擊可以生成使用，分享到朋友圈。

2、分享墻——用戶上傳的自己DIY作品。

3、立即制作——可以用自己的圖來DIY。

4、告訴我——告訴產品的改進，內容的增加。

想要體驗怎么制作屬于自己個性朋友圈照片的用戶，掃一掃下面的二維碼就可以啦!還等什么，趕緊掃碼體驗，開啟你的嗨圖之旅吧!