ionic 經常使用插件 tips

本文不是插件詳解，只是羅列公司上線項目中使用到的各類插件以及碰到的坑，若是像詳細瞭解一個插件建議去其官方 github 查看。

ionic 插件的安裝方法：ionic plugin add pluginName

我本身查找插件的方式：首先 ngcordova，而後是 cordova 官方（cordova 官方有點坑，千萬注意本身的 cordova 版本，不要找到萬年不更的插件，發現總是搞不出來）。

插件是各類原生代碼寫成的，因此建議 ionic 開發者們有空能夠多看看原生，若是碰到坑能夠本身改改。

cordova-plugin-app-version

app版本插件，用於提示 app 更新。

使用方式：

獲取版本號：cordova.getAppVersion.getVersionNumber()

tips：iOS 就不要作版本檢查了，由於 app 會被要求去除該功能！！！

cordova-plugin-console

看名字就懂了，就是把 js 文件的 console 讓你在 xcode 或者 android studio 控制檯裏看到 js 的console。

tips：調試神器。

cordova-plugin-geolocation

這個插件很是屌，調用原生 api 並把接口作成了 w3c 標準，簡單說就是你的定位相關代碼只須要寫一次，就能在 app 和瀏覽器兩端跑。

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log("navigator.geolocation works well");
}

deviceready 須要依賴於 cordova-plugin-device 插件。

tips：

• iOS 設備支持度很是高，定位效果也不錯，android 部分設備沒法獲取定位。若是對於定位要求很高，最好結合原生作。

• 必需要按上面例子當中在 deviceready 出發後來完成定位，否則會出現 iOS 上提示兩次的問題。

cordova-plugin-inappbrowser

在 app 裏面打開網頁就須要這個插件了。用法相似 geolocation 同樣，他作了兼容，直接使用 window.open 便可。

tips：ionic 當中 a 標籤 tel 呼出撥號的時候會有問題，須要寫成這樣：click 事件裏 window.open("tel:" + 800xxxxxxx, "_system");

cordova-plugin-splashscreen

進入 app 的那個畫面就是用的這個插件啦。

tips：ionic 提供了 ionic resource 的圖片工做流，也就是他會自動生成各類尺寸的 splash 圖片。但須要注意的是，你須要在 xml.config 當中添加完整，否則會出現部分機型有圖片，部分機型仍舊是cordova logo 的狀況。

cordova-plugin-statusbar

狀態欄插件，支持開發者定義狀態欄。使用方式參考 readme 便可，簡單實用的一個插件。

ionic-plugin-keyboard

鍵盤插件，就是讓 app 裏的輸入框能彈出鍵盤的。這是 ionic 做者本身的項目，我就很少說什麼了吧。

tips：app 初始化定義一下就能夠了。

cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);

cordova-plugin-x-toast

原生 toast 提示，用安卓的應該都知道，原生的 app 那種提示，ionic 也能作哦。用法不少，請參考其 github。

tips: ngcordova 下的，因此直接用 $cordovaToast 便可。