如何在vue.js中使用离子电容器中的Cordova插件

Question

我不知道如何在我的vue.js组件中使用这个电容器插件。或任何离子原生或cordova插件..https://ionicframework.com/docs/native/contacts

我可以让电容器的api工作得很好。https://capacitor.ionicframework.com/docs/apis/device

感谢您的任何知识！

Answer 1

以下是最终对我起作用的方法：

我查看了Ionic网站上的插件：https://ionicframework.com/docs/native/in-app-purchase (在我的例子中)，然后为了安装，我运行npm install cordova-plugin-inapppurchase，然后运行npm install @ionic-native/in-app-purchase。然后在我的Vue JS文件中，我使用import { InAppPurchase } from '@ionic-native/in-app-purchase/ngx';导入了插件

接下来的部分就是让我犯错的地方。在下一行，我必须创建一个新的变量来访问引用的插件。因此，下一行代码是const iap = new InAppPurchase();

然后，您可以访问iap变量，并在您的Vue应用程序中使用所有记录在案的方法。

请记住，任何Cordova插件的测试都需要在您的设备上进行。

希望这篇文章能帮助像我一样苦苦挣扎的人！

Answer 2

根据这里的文档，https://capacitor.ionicframework.com/docs/cordova/using-cordova-plugins你应该能够做到

npm i cordova-plugin-contacts
npm i @ionic-native/contacts
npx cap sync

只要记住

要点:配置电容不支持Cordova安装变量、自动配置或钩子，因为我们的理念是让您控制本地项目源代码(这意味着钩子之类的东西是不必要的)。如果你的插件需要设置变量或设置，你需要通过在插件的plugin.xml和iOS和Android上的所需设置之间进行映射来手动应用这些配置设置。

有关如何配置每个平台的信息，请参阅iOS和安卓配置指南。

兼容性问题一些Cordova插件不能与Capacitor一起工作，Capacitor提供了一个相互冲突的替代方案。有关详细信息和已知的不兼容列表，请查看此处。