以下是我接觸小程序項目遇到過的一些問題做的一些記錄。（后續有遇到新的問題再進行補充）
1.微信小程序的 text 標簽，它相當于 span 標簽，但是在使用的時候不能換行，否則內容也會換行顯示。
2.小程序的自定義組件除繼承樣式外，app.wxss?中的樣式、組件所在頁面的的樣式對自定義組件無效。解決方法可參照官方文檔對自定義組件設置外部樣式類或者使用全局樣式類。參考鏈接如下：https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html
3.小程序的mastache語法不支持js的方法，即在頁面標簽中，使用以下js 方法無效，Object.keys()；toString()；indexOf()。因此在遇到頁面需要使用以上方法時，可在相應頁面的js里進行處理并返回一個可供頁面獲取的值。
4.rich-text 可實現對后端返回的html字符串的轉化，使得其能在頁面得以展示。
5.小程序彈層穿透問題，描述：在出現彈出層時，底部的頁面會出現可滾動情況。解決方法：
（1）彈窗的內容沒有滾動或者不需要滾動時，可通過給遮罩層定義一個防止事件冒泡的方法，catchtouchmove="true";
（2）彈窗的內容可滾動時，可通過動態添加樣式的方法：
.no-scroll{
????top:0px;
????left:0px;
????width:100%;
????height:100%;
????overflow:hidden;
????position:fixed;
????z-index:0;
}
如彈窗出現，加入該樣式，關閉時，去除該樣式。
6.對圖片進行base64轉碼遇到的問題。
一開始我是用了這種方式進行轉碼,
wx.request({
????url: filePath,
????method: 'GET',
????responseType: 'arraybuffer',
????success: function (res) {
????????console.log(res)
????}
});
在開發工具上測試是沒有問題的，但是當我在真機上上傳的時候，發現報錯了，提示了 request:fail invalid url （無效地址問題）。最后是采用了以下方法解決的，使用這種方式wx.getFileSystemManager().readFileSync 對圖片進行轉碼。
該解決方案來自于?好的經驗要分享：chooseImage轉base64
7.開發過程中遇到首頁在登錄的情況下要顯示購物車懸浮按鈕，但是在app.js獲取token會有一個時間上的問題（可能跟手機的網絡也有一定關系），導致真機使用的時候（開發者工具上顯示是沒有問題的），一直顯示不出來，暫時的解決方法是設置一個定時器去請求購物車接口，如有更好的方法再修改。
8.頁面跳轉
（1）wx.navigateTo
wx.navigateTo({
????url:'',
????success:function(){},
? ? fail:function(){},
? ? complete:function(){}
})
url參數問題：不能跳轉到tabBar頁面；帶參數的格式：path?params=params¶ms1=params1
（2）wx.navigateBack()，關閉當前頁，返回上一頁或上n級頁面。可通過getCurrentPages()獲取當前的頁面棧，決定需要返回幾層。
參數：delta->類型:Number，默認值：1，說明：返回的頁面數，如果delta大于現有的頁面數，則返回首頁。
（3）wx.redirectTo()，關閉當前頁，跳轉到非tabBar的某個頁面。
url參數問題：不能跳轉到tabBar頁面；帶參數的格式：path?params=params¶ms1=params1
（4）wx.reLaunch()，關閉所有頁面，打開應用內的某個頁面。
url參數問題：帶參數的格式：path?params=params¶ms1=params1，如果是跳轉到tabBar頁面，則不能帶參數。
（5）wx.switchTab()，跳轉到tabBar的某個頁面，并關閉其他所有非tabBar頁面。
參數：目標頁面必須是在：app.json的tabBar中定義的頁面；不能帶參數。
例：wx.switchTab({url:'/page/index/index'})
9.添加外部icon
由于小程序限制，wxss引入ttf時需要轉為base64的路徑，可通過該地址進行轉碼。完成轉碼后，把轉碼后的路徑復制到wxss里引入，這過程可能會遇到錯誤，因為上述轉碼的路徑會有換行，如果遇到錯誤，可對相關的換行去除即可。
10.小程序錄音功能
舊版的錄音功能wx.startRecord從基礎庫1.6.0開始已經停止維護，新的錄音api為wx.getRecorderManager()。用法如下，首先獲取全局唯一的錄音管理器：
this.recorderManager = wx.getRecorderManager();
開始錄音，有兩種格式的文件，一種為MP3，一種為acc，可根據需要進行配置。
this.recorderManager.start({
format: 'mp3' // 如果錄制acc類型音頻則改成aac
});
結束錄音：
this.recorderManager.stop()；
以上是錄音功能，recorderManager有一些相對應的監聽函數，這里列舉下我用到的，一個是onError，用于監聽錄音錯誤事件，一個是onStop，用于監聽錄音結束操作，通過監聽該狀態，對生成的錄音文件進行上傳存儲操作。
11.小程序播放錄音功能
組件audio也停止維護，wx.playVoice該api也停止維護替代為wx.createInnerAudioContext()。其用法如下：通過wx.createInnerAudioContext()獲取對應的InnerAudioContext 實例，然后使用this.innerAudioContext.src = this.data.src;對音頻文件路徑進行設置，使用this.innerAudioContext.play()進行播放操作。
以上是播放音頻功能，同樣的，createInnerAudioContext也有一些相對應的監聽函數，我用到了onPlay以及onEnded，用于監聽音頻的播放以及播放結束，對頁面的播放按鈕進行修改。
12.小程序picker組件
當picker的值是objArrays類型時，需要設置range-key="name"，否則組件選擇的值無法生效，顯示的下拉項會是[object Object]。
13.自定義下拉刷新
寫自定義下拉刷新的時候，出現了一個問題，如果使用fixed定位，把自定義的內容固定在頂部，并把這個組件的z-index設置為-1時，開發工具可以正常顯示，但是真機測試時卻無法正常顯示。
后面發現組件使用fixed定位，不是基于可視窗口定位，導致這一塊自定義的部分跟著頁面一起下拉了，而我們又設置了z-index：-1，所以導致在真機上看似乎是丟失了。現階段的做法是取消用定位的方式，定義一個狀態字段，檢測到下拉刷新的操作時，設置一個狀態讓它顯示。（待優化）
14.原生組件video優先級
由于原生組件video優先級是最高的，所以導致在ios手機上，我們自定義的tab組件被遮擋住了。官方提供了cover-view、cover-image，用于覆蓋在原生組件之上，可覆蓋的原生組件包括map、video、canvas、camera、live-player、live-pusher。但是cover-view有一個不足是目前不支持字體icon，只能使用圖片代替（該問題開發工具上無法發現，只能在真機的時候才能發現有這問題存在）。
15.createVideoContext的使用
在頁面中如果我們要獲取videoContext對象，那我們可以直接用wx.createVideoContext(id)進行獲取，但是如果在自定義組件里使用的話，那么必須修改成wx.createVideoContext(id,this)，否則對應的play，pause等方法都無法調用成功。
16.echarts 圖表
部分ios會出現echarts 圖表渲染后頁面滑到底部頁面會卡住的現象，具體是在IOS真機中當手指觸摸圖表交互時，阻止了頁面正常上下滑動。發現導致的原因應該是ios版本問題，在ios12版本的手機上沒發現這種情況，現在針對這種情況暫時的處理是對ec-canvas.html進行修改，刪除bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"這一部分代碼。這樣的操作會使得無法觸發echart的一些特效。
17.圖片顯示問題
針對圖片寬高不一致，但是我們又需要對圖片進行寬高限制，導致顯示時可能出現圖片寬度或高度被拉伸或者壓扁問題。針對此問題，我們可以采用小程序提供的mode屬性進行處理。mode屬性可以對圖片進行縮放、裁剪，以確保我們的圖片是顯示時不會出現被拉伸/壓扁的問題。
