最近一個多月斷斷續續的寫了個小程序，就記錄下之前遇到過的坑。
首先放一個微信小程序爬坑的一個查詢網站：http://www.wxapp-union.com，這里挺多的問題都能找到，我也差不多都是這里看到
1.關于微信https的問題
微信在接口的調試上限制挺多的，在模擬器上調試的話把開發者工具詳情里的不校驗Https勾上，那么非https的地址確實可以訪問了，但是在真機上測試的話，需要在右上角的三個點里把調試工具打開再重新打開項目才會有數據接入，否則的話是沒有效果的，
webview的話那就必須是真實環境的調試，因為公司一般會有一個或多個https的域名，那么測試只能在這個上面進行，比如一些詳情頁和小程序的交互；注意在一些外部鏈接放入的話會有一些問題。
2.關于用戶授權的問題
在小程序之前的版本里，詢問授權的api是可以直接發起的，而之后官方在這個api上做了修改，導致我一度以為是我自己調用的方法不對，具體可以去官方的文檔查詢wx.getUserInfo，然后去社區可以看看相應的問題。基本上在第一次的時候要用Button組件設置屬性open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo"，前面是設置成發起授權的屬性，后面是回調，官方覺得可能直接問用戶要權限顯的不是非常友好，也能理解；
所以基本上都會是一個授權按鈕頁面，或者你可以說是綁定之前的賬號或者，可以放一個紅包頁面，然后提示用戶授權登錄即可領取紅包，我暫時用的是單獨一個綁定頁面讓用戶去授權并綁定我們平臺對應的賬號，。。對。。。因為我們是要通過unionId來同步以前已經注冊過的用戶的相關資料。這里的綁定的問題來稍微說明一下：
首先你要通過wx.login來獲取用戶的code（一般傳給后端消費一次就要重新調用來使用），這個不用授權，登錄就有，然后傳給后臺，他會給你自己平臺的校驗token什么的，具體要和后端討論，然后獲取回來后就能通過token來確定用戶的相關信息了。
還有就是授權設置界面是能通過wx.openSetting來跳轉，不過快要廢掉了，也要用button組件來發起了，可以先通過wx.getSetting來查看用戶給來哪些權限。
3.微信是不支持div這些標簽的，雖然div放進去也不會報錯，但是最好不要用。。其實小程序的布局感覺借鑒好多框架的，，至少rn使用view,text等。。
我一般會在app.wxss里放入view==》
box-sizing: border-box;
word-break: break-all;
/* 防止純數字不換行 */
來把盒子模式自己設置過，還有就是如果是純數字微信默認是不換行的，所以就自己加一個，可以把統一的樣式放入這個文件。
我公司是做電商的，商品詳情的很多圖肯定都是Html格式的，，我推薦用wxParse，好使，簡單，無腦，直接放入項目，他有個Icon的文件好像，我刪掉了，太大了
微信不支持Dom操作，可以通過下面這個api去操作：這個是例子，具體去文檔看
wx.createSelectorQuery()
4.tabBar的設置。。
你可以選擇自己寫，如果想偷懶那么就直接用他的，也挺方便的，就是要注意圖片的路徑什么的，；
關于頭部的東西，，我是不怎么推薦自己寫，挺麻煩的，當然閑的話可以自己寫，把navigationStyle設置成custom 模式就能隱藏默認的頭（全局的），注意三個點和圈是還在的，我看貝貝都是自己寫的；不支持漸變！！！！！
5.微信不支持想vue一樣的管道過濾器，所以只能自己寫方法，在數據獲取后自己過濾，要先過濾在set進去，一般在untils里加入個時間過濾方法或者其他什么的
6.關于webview的用法，就直接<web-view src="{{url}}"></web-view>好了。要穿什么參數么，在onload里的options自己處理嘛
7.關于一些自己寫的浮層彈窗
小程序不支持就是類似boot那種在body里可以加內容的組件，官方回復是自己寫咯。。。自己寫的話，如果你的彈窗出現后，彈窗蓋住的頁面依舊能夠滾動的，所以我建議是吧下面的東西用scroll-view包住，如果彈窗出現，那么scroll-y什么的設置成false，彈窗現實再設置成true,注意，，用了scroll-view，那么在json文件里最好把disableScroll設置成true。
8.請求的方法request最好統一封裝一個，否則要修改就聽麻煩的，放一個我寫的：有點垃圾，不過能用至少，哈哈
var baseUrl = getApp().globalData.apiBaseUrl;
function ajaxFetch(url, data, type) {
let sendObj = data || {};
let tmp = Date.parse(new Date()).toString().substr(0, 10);
return new Promise((resolve, reject) => {
wx.request({
url: baseUrl + url,
data: sendObj,
header: {
'FYH-App-Key': '',
'accept-Language': 'zh_CN',
'FYH-Session-Id': wx.getStorageSync('sessionId'),
'content-type': 'application/x-www-form-urlencoded',
'FYH-App-Timestamp': tmp
},
method: type,
success: function (res) {
if (res.statusCode == 302) {
// 這里是校驗憑證過去
} else {
resolve(res);
}
},
fail: function (err) {
reject(err)
}
})
})
}
module.exports = {
get: (url, data) => {
return ajaxFetch(url, data, 'GET')
},
post: (url, data) => {
return ajaxFetch(url, data, 'POST')
}
}
// 調用方法
var fetch = require("../../utils/fetch.js");// 先引入
fetch.get(url).then((res) => {
}).catch((err) => {
})
fetch.post(url, obj).then((res) => {
}).catch((err) => {
})
對對對，，可以用。。
9.關于wx.uploadFile(OBJECT)
Fuker,傳圖片的地方我暫時只能一張一張傳，不會批量傳。。有點坑的，Loading能好久，如果網速差一點就超時了，，目前我就傳的是壓縮圖，然后規定了最多5張，遞歸傳嘛，還有就是如果還要傳參數，要注意編碼問題，還有就是返回的字段要先調用JSON.parse(res);
10.關于生成小程序碼進入對應的頁面。。。//先貼個生成小程序菊花碼的地址：https://developers.weixin.qq.com/miniprogram/dev/api/qrcode.html
里面有對應path的字段，要后端去批量生成，然后我們前端需要
var id = decodeURIComponent(options.scene)；獲取對應id
options.scene是生成小程序碼的參數
其實主要是小程序的掃一掃二維碼匹配規則的地方只有5條的限制才去搞這個小程序碼的，，
這里還有就是我把商品圖片和小程序碼合成一張圖。。
這里會涉及canvas，我就提一點，其他都沒啥大問題，文檔也說的挺詳細的，就是網絡圖片地址不能直接放入canvas，不然讀不出來的。。要先調用 wx.getImageInfo來獲取具體Path然后在繪制
11.關于Input沒有類似v-model的功能，
wxModel(e) {
let nowData = e.currentTarget.dataset.model;
var temData = {};
temData[nowData] = e.detail.value;
this.setData(temData)
}
自己寫一個雙向綁定的咯。。小程序的set數據是同步更新的，不過能在setData的后面加回調，保證數據渲染了再去執行你想執行的東西
example:
this.setData({
obj:obj
},()=>{
// do something
})
12.關于textarea組件，都不想吐槽了，，一直這樣，官方也沒有優化，估計就是你愛用就用，不愛拉倒咯。。
其他功能其實也都差不多，不過有幾點我真的煩
一.各種樣式無法調整，邊距大小什么的，
二.對應的層級是最高的，如果一個頁面里有textarea組件，還有自己的彈框，，那么問題就來了，你的textarea會完全蓋過你的彈框，無論怎么設置z-index都沒有用，還有就是如果把他設置成disable為true，模擬器上沒啥問題，，真機上依舊如此
我的建議是，，，最好不要用啊。。賊煩
13.關于input的一個坑
password的屬性如果來回切換的話會出現無法選中Input的情況，并且第一次成功切換的話也會出現閃現，效果并不是很好，不建議使用這個，社區也問了，至今沒有解決，如果有的就留個言，謝謝啦~~~
14關于支付方面的
有坑的地方就是，剛接觸的時候不用看下面注意事項，，因為其實根本不會有那么多手機給你測試，用戶取消支付觸發失敗就是fail的里面調用，complete里的回調最好不要用。。我自己碰到的賊菜哈哈，
還有就是wx.requestPayment的參數問題。
其實各種參數都需要后端去走公共支付接口獲取，前端只要通過接口把訂單ID告訴后端就好了，，注意，，消費一次就要重新獲取哦
15.關于數據默認為true后又要設置成false的情況，一些數據是要異步數據設置，會出現如果有，但是會閃一下，最好先都是false，在去設置對應的顯示效果
16,關于數據設置順序的問題，首先setData的都是同步發生的，并沒有所謂的異步，有的回調也只是監聽他渲染結束的一個動作，如果是一個數組的，最好是先concat()一個數組在去操作，最后在賦值回來，這個不想vue一想更新之后能自動更新，沒有數據監聽的概念。
17,關于圖片背景
如果有些場景要用圖片，要么就是用Image,要么就是背景圖把圖片轉成base64位的情況，如果把大圖放入背景圖，那么又出問題。千萬====<image src=""/>一定要閉合！！！（///////）這個東西
18.關于提交審核的問題
我前幾次沒有涉及到錢的版本，基本上2-3個小時就過了，，這次加了個我的資產，，就單顯示了一個數據，，審核居然2天。。
所以，最好不要有金額方面的東西。
19.登錄綁定的測試基本都是在真實環境，用自己號多次幾次吧~~
20.小程序view組件無法是被\n或者后臺返回的?字符串，只能使用text組件
21.最近換了個安卓機，發現以前一直用Oppo vivo測，并沒有拿華為測試，有個小毛病，就華為上有，如果一個父div下子div右浮動并且里面包含了Input,那么這個定位會跑走，清除浮動也沒有用，最后都改成后邊有輸入用absolute解決的。一直沒發現，老板沒看到還好，不然要被扣工資了
22.今天朋友給我發了個奇怪的bug
社區里也有碰到自定義組件在某些版本里出現問題，目前我還沒想到啥解決辦法，先記錄下，等知道方法了在更
