vue+cordova開發app心得體會(ios)

開始接觸vue已經有三個月左右，開始作了一個微信項目，發現用起來以後效果特別好，由於通過gzip壓縮以後頁面打開就250kb左右的資源加載；相對於以前使用anguarJs開發，實現效果比以前有很大的飛躍；微信項目作完以後，滿懷信心的開始vue+cordova進行app開發；確沒有想象中的順利，下面是使用vue+mint-ui， cordova進行手機app開發的一些心得體會(主要以ios爲主)；

ios滾動優化
問題描述：在ios頁面滾動過程當中，當手指離開頁面的時候，頁面就中止滾動，顯得很不流暢，卡頓

---

方案：

一、-webkit-overflow-scrolling:touch

https://developer.mozilla.org/zh-CN/docs/Web/CSS/-webkit-overflow-scrolling

優勢：解決頁面滾動卡頓問題，頁面滾動流暢，頁面回彈效果；
缺點：穿透滾動,z-index不能穿透一切

二、引入第三方的滾動插件，（better-scroll）
優勢：

解決移動端滾動問題，本身能夠控制滾動有主動權；

缺點：

庫有缺陷，慎用點擊事件，api不夠完美，會產生莫名其妙的bug

三、封裝page組件用於控制滾動

優勢：可以有效的控制-webkit-overflow-scrolling的值，當頁面彈起時候使用設置組件的-webkit-overflow-scrolling值爲auto就能夠了，
缺點：不夠自動化，須要不少變量去控制

---

鍵盤事件
問題描述：當鍵盤彈起時候，頁面上移，頂部header應固定不動，（到如今依舊未找到合適的解決方案）解決方法：http://blog.csdn.net/lovelyel...
(不知道是否是個人姿式不對，並無解決個人問題)

三、頂部狀態欄適配；
在ios開發中應該設置頂部狀態欄爲浮在整個頁面以外，設置狀態欄爲背景透明；這樣才能讓整個h5頁面撐滿整個屏幕；

本人是理科生，文字表達能力不行，多多見諒，若是看到請多多提提意見，但願往後可以更好的用文字表達本身的想法；