主要問題

bug: 通過ref調(diào)用組件方法時，發(fā)現(xiàn)使用的是上一次的數(shù)據(jù)。

原因：微信小程序可以在修改組件的properties的傳值之后、立即調(diào)用組件方法；

uniapp在修改組件prop的傳值之后，需要在this.$nextTick中調(diào)用組件方法。

但是在百度小程序里，即使有this.$nextTick依然沒有解決這個問題，于是又追加了一個setTimeout。

Error: [TMA][WARN][RUNTIME] Page route 錯誤 +0ms switchTab before pages are registered.

解決：用最新的基礎(chǔ)庫。

bug: 通過value屬性給input傳值沒有生效。

當(dāng)重復(fù)設(shè)置某些屬性為相同的值時，不會同步到view層。 例如：每次將scroll-view組件的scroll-top屬性值設(shè)置為0，只有第一次能順利返回頂部。 這和props的單向數(shù)據(jù)流特性有關(guān)，組件內(nèi)部scroll-top的實際值改動后，其綁定的屬性并不會一同變化。

解決：組件屬性設(shè)置不生效解決辦法

差異：getSetting返回

百度小程序即使沒授權(quán)過，通過getSetting獲取的authSetting中的scope.userInfo也為true。

支付寶小程序獲取的authSetting中的用戶信息授權(quán)狀態(tài)對應(yīng)的key不是scope.userInfo，而是userInfo。

• 微信、qq

bug：（微信、qq）swiper顯示異常。

原因：swiper-item組件上不可以綁定內(nèi)聯(lián)樣式（:style）。

問題：（微信、qq）自定義tabbar圖片閃爍。

解決：用base64代替圖片。

Error: （qq） 文件common/vendor.js超過500k，不進(jìn)行ES5轉(zhuǎn)換或壓縮，請自行轉(zhuǎn)換壓縮。

原因1: 未壓縮。

解決：在package.json的dev:mp-qq的配置末尾添加“–minimize”。

原因2：uniapp生成的qq小程序的vender.js文件中的sourceMappingURL過大。

解決：vue.config.js中配置：當(dāng)process.env.UNI_PLATFORM === 'mp-qq'
時productionSourceMap = false。

• 頭條

bug: （頭條）通過$ref獲取一個組件的實例，并將這個實例賦值給一個變量后，這個變量所保存的實例的prop不會隨著組件傳值的改變而改變。

解決：不通過被賦值了this.$refs.xxxComponent的變量調(diào)用組件的方法，而是每次都用this.$refs.xxxComponent.xxxMethod()的方式調(diào)用組件的方法。

問題：（頭條）只有抖音可以調(diào)起廣告，今日頭條不能調(diào)起廣告，但是今日頭條的createRewardedVideoAd不為空，此api的存在與否不能用來判斷廣告能否使用。

解決：用tt.getSystemInfoSync().appName.toUpperCase() === 'DOUYIN'來判斷。

bug：（頭條）樣式混亂。

（1）在字節(jié)跳動的style中發(fā)現(xiàn)：

:host{
	display:block;
	white-space: normal;
}

的代碼。

因為影響的范圍不大，單獨在兩處設(shè)置了一下white-space的值即解決。

（2）頭條的樣式在對連續(xù)幾個嵌套的元素使用height: 100%時會出問題。

bug: （頭條、支付寶）button的getuserinfo事件失效。

只有微信、QQ、百度的button有g(shù)etuserinfo事件。

頭條調(diào)用getUserInfo彈起授權(quán)彈窗，如果點擊取消后即拒絕授權(quán)，以后再也不能彈出（微信是從來不會彈窗）。這時候，只能靠openSetting來引導(dǎo)用戶打開權(quán)限后，再調(diào)用getUserInfo獲取用戶信息。

雖然百度的button有g(shù)etuserinfo事件，但百度的getUserInfo接口不能調(diào)用?？梢园裝utton的getuserinfo事件獲取到的數(shù)據(jù)存起來，以模擬一個getUserInfo接口。

支付寶獲取用戶信息現(xiàn)已升級為“獲取會員基礎(chǔ)信息”，點擊查看文檔。其中button屬性中的onGetAuthorize在uniapp中書寫為@getAuthorize，即可成功編譯。

• 百度

bug：（百度真機）運行上傳功能失敗。

原因：JSON.parse()使用時參數(shù)傳入了object類型而不是string類型的數(shù)據(jù)，導(dǎo)致了報錯。

因為返回的data為object類型，去掉JSON.parse()后，代碼運行正常；不久后這里又開始報錯，發(fā)現(xiàn)返回的數(shù)據(jù)又變?yōu)閟tring類型。于是補充邏輯：判斷返回數(shù)據(jù)為string類型時，再JSON.parse()一下。

因為JSON.parse()傳入?yún)?shù)類型不為string的錯誤有多處，鑒于平臺差異，最好在使用時都判斷一下類型。

bug: （百度）圖片預(yù)覽失敗，黑屏。

原因：百度小程序不支持將getImageInfo獲取到的本地路徑作為previewImage的圖片列表參數(shù)。

解決：使用previewImage時，用網(wǎng)絡(luò)圖。

bug: （百度、支付寶）圖片保存錯誤。

原因：百度的getImageInfo返回的數(shù)據(jù)中沒有errMsg字段。

由于之前判斷圖片保存成功的方式是res.errMsg === 'getImageInfo:ok’，導(dǎo)致了錯誤。

解決：百度、支付寶小程序用其它字段（path）判斷圖片保存狀態(tài)。

bug：（百度）數(shù)組的長度在頁面上更新異常。

當(dāng)用xxxList.length作為插值時，

對xxxList做長度減少的操作，頁面更新正常；

對xxxList做長度增加的操作，頁面不更新。

解決：額外定義一個變量來代替xxxList.length作為插值。

特殊：（百度、支付寶）當(dāng)scroll-view元素內(nèi)滾動區(qū)域的長度不大于scroll-view本身在此方向的長度時，不會觸發(fā)scrolltolower事件。當(dāng)沒有對一個縱向的scroll-view設(shè)置高度，它的高度完全被它所包含的元素?fù)伍_所決定時，會導(dǎo)致不能正常觸發(fā)scrolltolower。

• 支付寶

問題：（支付寶）通過v-show隱藏組件失敗。

選中元素可以看到v-show已經(jīng)編譯成了支付寶支持的hidden=true，其它小程序也出現(xiàn)過v-show失效的情況，所以不推薦在uniapp中使用v-show。

解決：改為v-if。

問題：（支付寶）樣式錯亂。

解決：用uniapp時，不同組件中的同名樣式類名在支付寶會互相干擾，需要在style標(biāo)簽中加上scoped、修改類名。

支付寶小程序還需要一些樣式重置：

/* #ifdef MP-ALIPAY */
button{
  border: none;
}
input{
  background: transparent;
}
/* #endif */

特殊：（支付寶）文件名或文件夾名中不允許出現(xiàn) @ 符號。

問題：（支付寶）開發(fā)工具【清緩存】中的【清除數(shù)據(jù)緩存】表面清除了緩存，實際上沒有清除；調(diào)試器里Storage面板左上角圓形的Clear All按鈕才能真的清除緩存。

bug：（支付寶）canvas繪制失敗。

解決：添加id。canvas 組件的標(biāo)識是 id，而不是 canvas-id。

bug：（支付寶）上傳圖片卡在上傳中。

原因：uni.uploadFile在且僅在支付寶小程序上有個一必填字段fileType。

bug：（支付寶）某個接口在開發(fā)工具上請求異常。

原因：對比其它小程序，發(fā)現(xiàn)支付寶小程序請求參數(shù)中有漢字，而其它小程序會自動將漢字進(jìn)行編碼。用encodeURIComponent手動編碼之后解決。

問題：（支付寶）在手機上，某個通過js計算設(shè)置寬度的列表寬度異常大。

原因：其它平臺通過uni.getSystemInfoSync()獲取到的screenWidth、screenHeight的值均為css像素，但在手機上的支付寶小程序獲取到的值為物理像素。

解決：在支付寶平臺上，當(dāng)獲取到的screenWidth>500時，取screenWidth/pixelRatio的值使用。

bug：（支付寶）選擇圖片獲取數(shù)據(jù)有誤。

原因：支付寶用chooseImage()獲取到的數(shù)據(jù)中沒有tempFiles字段，只有tempFilePaths字段。

Error：（支付寶）有的圖片保存失敗，在getImageInfo處報”下載文件失敗”的錯誤。

解決：
原有保存邏輯：uni.getImageInfo-> uni.saveImageToPhotosAlbum。

支付寶作區(qū)分：uni.saveImageToPhotosAlbum。

因為saveImageToPhotosAlbum接口不支持網(wǎng)絡(luò)圖片路徑，所以原有的保存邏輯中，需要先用getImageInfo來獲取一個本地路徑再保存。而uni.saveImageToPhotosAlbum編譯成支付寶小程序代碼后是my.saveImage，這個接口對圖片路徑是沒有要求的，所以當(dāng)運行平臺為支付寶時可以省去uni.getImageInfo這步。

參考文章

• uni-app適配微信小程序自定義tabBar
• uni-app · 支付寶小程序踩坑
• uni-app 開發(fā)支付寶/百度小程序注意事項

其它問題

問題：導(dǎo)入項目時沒有反應(yīng)（mac電腦，百度小程序、支付寶小程序）。

原因：開發(fā)工具不明原因的沒有了權(quán)限。
解決：

（1）使用root權(quán)限打開應(yīng)用程序。（但是過于麻煩。）

（2）因為每次用npm運行項目都需要sudo來執(zhí)行，懷疑node安裝到了一個權(quán)限太高的地方，通過nvm重新安裝一次node之后解決。

問題：ios用charles連代理后接口請求不到。

原因：在下載證書并在描述文件中啟用證書后，還需要在設(shè)置→通用→關(guān)于本機→證書信任設(shè)置里面啟用完全信任Charles證書。

微信代碼轉(zhuǎn)uniapp代碼的全局替換總結(jié)：

• wx: —> v-
• v-key —> :key
• {{ —> （空）
• }} —> （空）
• bind:?tap —> @click
• catch:?tap —> @click.stop
• bind:? —> @
• wx. —> uni.
• this.data. —> this
• <block —> <template
• elif —> else-if
• triggerEvent —> $emit