用uni-app開發(fā)多端應(yīng)用,之前打包的微x小程序好好的匀归,打包成字節(jié)的就各種兼容問題坑资,UI框架用的uView的1.x版本,也是各種兼容問題:
1穆端、上傳圖片上傳不了
上傳圖片用 uni.chooseImage 選中圖片后袱贮,得到的本地臨時路徑是個下面這樣的:
ttfile://temp/ab790db96c9b65cb54685c7d99c4d847.jpeg
直接用這個路徑通過 uni.uploadFile 接口上傳,會上傳不了
解決辦法:要用 uni.compressImage 這個壓縮圖片的接口去壓縮下体啰,再用獲取到的路徑去上傳就可以了:
ttfile://temp/tempCompressImg1642681468739.jpg
對比了下兩次獲取到的本地路徑就中間的文件名部分不一樣攒巍,微x小程序就沒這個問題
2、用web-view展示pdf文件在安卓上不顯示
頁面用web-view來展示pdf文件荒勇,在ios和開發(fā)工具里都沒問題柒莉,但在安卓手機上頁面打開成功一直顯示空白,解決方案先用 uni.downloadFile 下載下來文件沽翔,在通過 uni.openDocument 打開文檔兢孝,但是安卓真機上打開依然只顯示一個pdf文件名,需要自己再點一下通過wps之類的其他第三方應(yīng)用打開
3仅偎、子組件傳遞事件$emit里的事件名不能加“-”
子組件像父組件傳遞事件時跨蟹,事件名里加了橫杠“-”編譯之后事件都是無效的,像下面這樣的:this.emit('on-success', true)...要改成 this.$emit('onpick', info) 才有用
4窗轩、子組件里多個slot編譯無效
自己封裝的組件里有多個 slot 的都編譯不出來,uview的很多組件也一樣有問題
5威恼、勾選了es6轉(zhuǎn)es5品姓,lodash里用到的函數(shù)報錯
一般我們都會勾選上es6轉(zhuǎn)es5,頁面里如果有用到 lodash庫里防抖節(jié)流函數(shù) debounce箫措、throttle會直接報錯腹备,如果不轉(zhuǎn)則沒問題
6、安卓小程序點擊空白讓輸入框鍵盤收起會觸發(fā)2次頁面的點擊事件
有個頁面正好有用到輸入框和uview的步進(jìn)器斤蔓,先點擊輸入框獲取焦點同時鍵盤彈出植酥,如果此時正好直接去點步進(jìn)器的 + 或 - 會直接加減2
解決辦法:設(shè)置個變量去禁掉步進(jìn)器 disabled,輸入框獲取焦點focus事件里去設(shè)置disabled=true,burl事件里用個定時器設(shè)置disabled=false友驮,這樣用戶要自己先點一下空白收起鍵盤后漂羊,才能點擊步進(jìn)器
7、uni.getEnv方法字節(jié)小程序不支持
小程序里web-view可以直接用uni.navigateTo之類的接口跳回小程序或者和小程序通信卸留,單需要在網(wǎng)頁里引入對應(yīng)平臺提供的通信sdk文件走越,像獲取環(huán)境信息的 uni.getEnv 方法字節(jié)小程序里是不支持的
8、uni-app打包優(yōu)化
uni-app打包一般會根據(jù)環(huán)境變量來自動設(shè)置接口域名耻瑟,但是uni只有生產(chǎn)模式production才會壓縮代碼旨指,有時我們開發(fā)、測試環(huán)境也需要真機上預(yù)覽喳整,如果不壓縮代碼有時會提示包超除大小限制(一般主包限制2M)
解決方案:通過默認(rèn)的 NODE_ENV 命令行變量去讓打包生產(chǎn)模式谆构,自己再額外加一個VUE_APP_ENV變量來判斷接口地址,如下面這樣的命令:
"build:mp-toutiao-dev": "cross-env VUE_APP_ENV=development NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --minimize --watch"