今天給各位分享uniapp開發(fā)遇到的坑的知識，其中也會對uniapp開發(fā)注意事項進行解釋，如果能碰巧解決你現(xiàn)在面臨的問題，別忘了關(guān)注本站，現(xiàn)在開始吧！

uni-app踩坑：微信小程序中view設(shè)置overflow: auto無法手勢滑動

前幾天在開發(fā)注冊功能時，需要彈一個顯示注冊協(xié)議的Modal，由于協(xié)議文字很長，需要用戶手動滑動查看。

于是理所當(dāng)然地使用一個view元素包裹協(xié)議內(nèi)容，然后設(shè)置height，并設(shè)置 overflow-y: auto ，這樣設(shè)置后在 微信開發(fā)工具 上使用鼠標(biāo)滾輪滑動ok，但是過兩天在真機上測試，what???，無論我手指怎么滑都滑不動。

經(jīng)過一通仔細 (胡亂) 調(diào)試，最終使用 scroll-view 解決了這個問題。

注意：使用豎向滾動時，需要給 scroll-view 一個固定高度，通過 css 設(shè)置 height。

關(guān)于 scroll-view 的更多介紹，請移步

在這里有一個疑問：為什么設(shè)置 overflow: auto 無法手勢滑動，而scroll-view可以呢？

我暫時沒有想到原因，歡迎知道原因的友友留言解答，謝謝！??！

uniapp之h5反向代理設(shè)置踩坑，解決跨域問題

uniapp可以適應(yīng)多個平臺開發(fā)，你會發(fā)現(xiàn)在HBuilderX上的內(nèi)置瀏覽器上調(diào)接口，沒問題；在小程序中，也沒問題；連接手機聯(lián)調(diào)也沒問題；

當(dāng)后臺設(shè)置允許跨域之后，前端h5需要進行設(shè)置反向代理才能解決這個問題。

在manifest.json文件中，我們需要輸入我們的端口號

然后去視圖源碼下查看多了h5這個配置

我們需要在自動生成的h5配置中進行編寫代理設(shè)置

這里需要注意的是"target" : " ", 這里是寫http還是https，需要與后臺保持一致，不然會報500.

然后我們?nèi)ナ褂梦覀兊拇?，進行帶接口

uniapp項目真機調(diào)試遇到的問題(持續(xù)更新中)

參考： HBuilder/HBuilderX真機運行、手機運行、真機聯(lián)調(diào)常見問題

驅(qū)動問題 ：電腦已安裝手機驅(qū)動，但是電腦沒有任何反應(yīng)或提示驅(qū)動問題，可通過以下方式解決：電腦安裝驅(qū)動精靈類程序，通過它們來重新安裝驅(qū)動（裝驅(qū)動比較好的方式是使用各種手機助手，比如360、騰訊的各種手機助手，如果有問題，嘗試升級助手的版本）。

備注 ：如果在啟動HBuilderX后才安裝驅(qū)動連接上手機，可能需要 重啟 HBuilderX；使用管理員權(quán)限運行HBuilder；關(guān)閉WebView調(diào)試模式，重啟HBuilderX重試。

在HbuilderX中進行真機調(diào)試，一般真機通過usb數(shù)據(jù)線連接電腦后電腦會自動安裝驅(qū)動，手動開啟設(shè)備的USB調(diào)試后HbuilderX就可以檢測到真機設(shè)備，如：

① 臺電的平板：平板通過usb數(shù)據(jù)線連接電腦后電腦會自動安裝驅(qū)動，手動開啟設(shè)備的USB調(diào)試即可被檢測到。

② 華為平臺(忘記型號了)：通過安裝華為調(diào)試助手后也能被成功檢測到。

③ 小米note3和米6：安裝小米驅(qū)動并重啟HBuilderX后才被檢測到。

uniapp開發(fā)ios提示不再可用

因為uniapp開發(fā)ios不兼容，所以不可用。

不得不說,任何一個開發(fā)者遇到蘋果手機都會或多或少需要做適配。在使用uni-app開發(fā)小程序時,.由于頁面大多數(shù)內(nèi)容都是動態(tài)獲取,當(dāng)頁面高度不給固定值時,讓其隨內(nèi)容的填充自適應(yīng)的時候,iPhoneXS Max手機在頁面底部會出現(xiàn)白版,安卓手機不會有此現(xiàn)象. 解決辦法:

//通過獲取系統(tǒng)信息拿到屏幕寬高比,

const SCREEN_WIDTH = 750

const RATE = wx.getSystemInfoSync().screenHeight / wx.getSystemInfoSync().screenWidth

data(){undefined

ScreenTotalH: SCREEN_WIDTH * RATE, //拿到真實手機高度

}

//展示內(nèi)容高度

//這樣后蘋果大屏手機內(nèi)容底部不會白板

2.獲取到時間字符串"2020-07-12 09:00:30" ,當(dāng)我截取后取時和分為單位,如果時為"00"時,頁面{undefined{dian}}點,顯示為'0'而不是我要的'00',這個問題十分奇葩,雖然不是大的影響,加個三目判斷:{undefined{dian=='00'?'00':dian}}點,就ok.

3.有時候小程序需要顯示APP分享過來的H5頁面,或者小程序本身需要顯示H5頁面時,需要配置https的域名,不然會無法正常顯示。補充:(H5頁面一般通過來展示,SRC里面的頁面都是后臺配置好的)

目前這是我遇到的蘋果端適配問題以及解決辦法。

uni-app小程序開發(fā)踩坑記錄

最近要從零開發(fā)一個跟后臺管理系統(tǒng)對接的小程序，因為功能比較復(fù)雜，時間短，選擇了比較火的uni-app，因為小程序出現(xiàn)的時間較短，各方面并不完善，開發(fā)過程中就是不斷踩坑的過程，特此記錄一小下。

uni-app雖然功能還不完善，但是插件市場里東西還是不少的，在搭建框架中因為需求要求借鑒了之前開發(fā)的PC端，所以有一些跟之前開發(fā)VUE相關(guān)的插件 ，可以提高開發(fā)效率，

插件：

坑：

1.覆蓋原生組件，需要用cover-view容器，但是cover-view里可包含的標(biāo)簽有限，類似view等在真機調(diào)試時不顯示，需全部替換成cover-view，且icon無法顯示，可以用cover-imaga代替。

2.小程序和小程序之間的跳轉(zhuǎn)（如騰訊云的人機滑動驗證），跳轉(zhuǎn)回來時需要進行操作，此時可以判斷app.vue中的options，如果按小程序文檔中來說當(dāng)options.scene === 1038時是小程序跳回來的場景，但是部分手機跳回來是options.scene為1001，只能將這2種都作為跳轉(zhuǎn)判斷的條件。

3.小程序跳轉(zhuǎn)回來app中的onshow有時不執(zhí)行，這個原因暫未找到

4.在uniapp的H5版本 ，接入 騰訊云滑動驗證 ，示例的點擊滑動驗證元素是通過dom操作的，但是無效，可能跟uniAPP不支持dom操作有關(guān)系，采用定制接入方法一，手動調(diào)用。

uni-app踩坑筆記

1.兩個普通頁面之間的跳轉(zhuǎn)用uni.navgateTo()，url可攜帶參數(shù)。

2.普通頁面跳tabbar配置過的頁面需要uni.switchTab()，url不能傳值。

3.uni.reLaunch()萬金油跳轉(zhuǎn)，可以跳轉(zhuǎn)任何頁面(克服了普通頁面跳tabbar配置的頁面url不能傳值的問題。)

4.突出中間按鈕的midButton，是偶數(shù)才能顯示，但只支持真機環(huán)境，瀏覽器是沒有效果的。

6.頁面生命周期(考慮的是頁面刷新帶來的影響)：

onLoad、onShow、onReady

應(yīng)用生命周期，指app.vue里面的這三個

7.箭頭函數(shù)沒有this指向（慎用），如果在控制臺打印this是undefined的，證明是箭頭函數(shù)在作怪，在特殊場合別貪方便，有時候會遇到抓破頭皮也找不到問題所在，就是箭頭函數(shù)搞的鬼。

8.uni.request（{,success:function(res){})}）請求成功返回的數(shù)據(jù)直接使用this直接賦值是不生效的，因為這是一個異步函數(shù)，需要借助一個指向：let that = this

9.setStorageSync 數(shù)據(jù)緩存是用來2個頁面交互的，傳數(shù)據(jù)傳值,寫在onLoad里面。

10.uni-app的view標(biāo)簽等于div標(biāo)簽，獨占一行。

5.和風(fēng)天氣官網(wǎng)提供的API是免費的，每人一天1000次數(shù)，夠練手了。

關(guān)于uniapp開發(fā)遇到的坑和uniapp開發(fā)注意事項的介紹到此就結(jié)束了，不知道你從中找到你需要的信息了嗎 ？如果你還想了解更多這方面的信息，記得收藏關(guān)注本站。