Ionic+Capacitor中使用cordova 官方提供的插件

发布于 1周前 作者 phonegap100 来自 分享

一、Capacitor 中使用cordova官方提供的插件

Capacitor中不仅可以使用系统内置插件,还可以使用Ionic官方以及Cordova给我们提供的插件,详情参考:https://capacitorjs.com/docs/cordova/using-cordova-plugins

Ionic中使用 Cordova Plugins:

npm install cordova-plugin-name
npx cap sync

二、Cordova Dialog插件演示

https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-dialogs/index.html

1、安装插件

cnpm i  cordova-plugin-dialogs --save
npx cap sync

cnpm 失败的话也可以尝试npm 或者 yarn

yarn add cordova-plugin-dialogs  等同于上面的 cnpm i  cordova-plugin-dialogs --save
npx cap sync

2、使用插件


(window as any).navigator.notification.alert(
        "You are the winner!", // message
        ()=>{
          console.log("执行一些操作")
        }, // callback
        "Game Over", // title
        "确定" // buttonName
);

三、Cordova 网络插件演示

https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-network-information/index.html

1、安装插件

cnpm i  cordova-plugin-network-information --save
npx cap sync

或者

yarn add cordova-plugin-network-information  
npx cap sync

2、使用插件

 getNetWork() {
      const networkState = (window as any).navigator.connection.type;
      
      alert("Connection type: " + JSON.stringify(networkState));
}

四、部分ionic 或者 cordova插件无法使用解决方法

https://capacitorjs.com/docs/android/troubleshooting#error-package-android-support-does-not-exist

npm install jetifier --save
npx jetify
npx cap sync android
回到顶部