第一次用uniapp這個框架愛開發APP,遇到好多坑,填的人很是頭疼.總結了一下遇到的一些問題,希望對剛用uni-app開發的小伙伴有些作用.
App開發中需要注意的一些問題
- 圖片/文件上傳(目前uniapp可以支持圖片上傳以及圖片預覽),如果要非圖片的文件,需要調用第三方的應用,目前只支持預覽,詳細可參考官方文檔
- 涉及到多個頁面之間數據交換時,頁面棧的使用,手機物理返回鍵和頁面左側的返回鍵,需要注意.可以根據具體情況使用不同的路由參數.關於頁面棧的問題,具體看項目需求而定,如果項目是比較大的,數據交互以及頁面之間數據傳遞比較復雜的話,要注意頁面數據的處理.
- 組件的使用,在有些組件不能滿足開發需求時,可以找到組件的封裝文件,自己修改相關的結構,達到自己想要的效果,但是要注意的是,修改后,所有引用該組件的頁面效果都會改變.還有就是一些組件的效果不能滿足項目的要求,需要我們在開發的時候注意在這些組件的基礎上添加自己需要的功能,這時候需要仔細測試,自己添加的功能有沒有與原來的功能發生沖突,以免影響整個組件的使用效果.
- 使用地圖等api的時候,需要注意,因為谷歌在國內不支持,需要調用百度,高德等第三方服務,這些需要去申請,在打包的時候在manifest中填寫
- 在圖片預覽及其他離開APP調用第三方軟件時候,會離開APP.即頁面棧,所以需要注意如果該頁面每次進來都會調用接口,從后台獲取數據,並且頁面有需要修改的數據,要將其保存在本地,否則再次回到該頁面會刷新數據,出現數據還原的問題
- 在項目中可能會遇到uniapp中提供的圖標不能滿足項目中的需求,項目中引用的一些圖標文件.ttf格式,可以通過下載High-Logic FontCreator這個軟件編輯,軟件使用方法自行百度查詢.
- 因為uniapp是使用vue開發的,所以vue中的一些方法都可以使用,如通過vuex可以設置全局的變量,方便使用,也可以將一些在項目中經常調用的方法和常量在main.js中掛載在全局的vue上,在其它頁面通過this調用等等
- uniapp中關於設置頂部導航欄有專門的方法,可以在官網查看具體的屬性,設置符合項目需求的導航
- 在開發過程中,因為有些功能已經有比較成熟的插件使用,可以在uni的官方插件市場找到符合項目要求的插件,引用到項目中,減少重新開發,節省時間.
- 還要注意的是,因為是通過HBuilderX開發的,並且項目中使用的api也是跟微信小程序的api基本相似,所以在測試的時候,可以運行在微信開發者工具上,方便測試一些功能,但是一些APP獨有的功能模塊,微信開發者工具並不能測試,這時需要連接手機,進行真機測試.,可以在編輯器的控制台看到你想輸出的內容,以便你修改測試的問題.
- uniapp開發中請求數據時,要跟后端協商好參數的類型,防止出現類型錯誤,后端拿不到相應的參數,
- 背景圖片的使用:支持base64格式圖片;支持網絡路徑的圖片;在使用本地路徑背景圖片需要注意:
- 圖片小於40kb,uniapp會自動將其轉成base64格式;
- 圖片大於等於40kb時,需要開發者自己將其轉成base64格式使用,或將其挪到服務器上,從網絡地址引用
- 本地背景圖片的引用路徑僅支持以~@開頭的絕對路徑,不支持相對路徑
- 在某個頁面存儲在本地的數據,在離開該頁面的時候需要及時清除,不包括其它頁面需要的數據,但是在登陸以及登出APP的時候需要清除,不然會影響APP中原先的數據.
- 在使用模態框的時候,如果有事件需要綁定給確定或者取消按鈕,需要在結構中單獨調封裝的事件,在后面跟自己的事件名