本篇文章給大家談?wù)剈niapp開發(fā)遇到的坑，以及uniapp開發(fā)技巧對應(yīng)的知識點，希望對各位有所幫助，不要忘了收藏本站喔。

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)用。

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)ナ褂梦覀兊拇?，進行帶接口

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ù)，夠練手了。

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)過一通仔細(xì) (胡亂) 調(diào)試，最終使用 scroll-view 解決了這個問題。

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

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

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

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

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