ionic Plugin插件,与原生app端交互,ionic端代码

创建plugins 目录 definitions.ts文件

definitions.ts文件:
import {Plugin} from '@capacitor/core/dist/esm/definitions';
declare global {
interface PluginRegistry {
//定义插件名称
Navigation: NavigationPlugin;
}
}
//定义接受参数类型
export interface NavigationPlugin extends Plugin {
echo(options: {value: string}): Promise<any>;
}
组件里面:
导入plugin插件
import {Plugins} from '@capacitor/core';
const { Device , StatusBar, Navigation , Callback} = Plugins;
ionic调用原生声明插件方法:
//Navigation为定义的插件。echo为插件命名方法名。()里面是调用传的值
const result: Promise<any> = Navigation.echo({value: '123'});
//调用成功后执行
result.then((data: Promise<any>) => {
console.log('调用');
console.log(data);
});
原生利用插件调用ionic方法
//bindwxsuccess为插件方法名,wx是调用的时候接受的参数
const handler = Navigation.addListener('bindwxsuccess', (wx) => {
console.log(wx);
});
ionic Plugin插件,与原生app端交互,ionic端代码的更多相关文章
- WebAPP与原生APP的交互设计区别
WebAPP和原生APP同为移动端,很少有研究这两项的交互区别,最近公司做了一次从原生APP到WebAPP(HTML5 )的移植,故总结一下期间遇到的问题及不同点总结. 从使用场景上,WebAPP用户 ...
- h5 与原生 app 交互的原理
现在移动端 web 应用,很多时候都需要与原生 app 进行交互.沟通(运行在 webview中),比如微信的 jssdk,通过 window.wx 对象调用一些原生 app 的功能.所以,这次就来捋 ...
- 客户端相关知识学习(二)之h5与原生app交互的原理
前言 现在移动端 web 应用,很多时候都需要与原生 app 进行交互.沟通(运行在 webview中),比如微信的 jssdk,通过 window.wx 对象调用一些原生 app 的功能.所以,这次 ...
- 【No.3 Ionic】超级逗表情 App
本人使用Ionic框架开发了一个 超级逗表情 的App 依赖插件 cordova-plugin-app-version 0.1.9 "AppVersion" cordova-plu ...
- 关于原生app、webApp、混合app的介绍
WebApp 原生App(Native App) 混合App(hybrid App) webApp: 用html5,css3 js开发的网页,运行在移动端的浏览器 zepto.angular.vue. ...
- iOS原生App与H5页面交互笔记
文/MikeZhangpy(简书作者)原文链接:http://www.jianshu.com/p/4ed3e5ed99c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近在做一个项 ...
- ionic 项目内部更新用到的插件,退出app插件
一 cordova-plugin-app-version插件 用来获取APP版本 ionic plugin add cordova-plugin-app-version -----cordova-p ...
- vue 与原生app的对接交互(混合开发)
小伙伴们在用vue开发h5项目特别是移动端的项目,很多都是打包后挂载在原生APP上的,那就少不了与原生交互了,我最近就是在坐这个,踩了一些坑,拿出来给大家分享下. 0.通过url传输数据:(一般是在入 ...
- zx-editor 移动端(HTML5)富文本编辑器,可与原生App混合(hybrid)开发
ZxEditor 移动端HTML文档(富文本)编辑器,支持图文混排.引用.大标题.无序列表,字体颜色.加粗.斜体. 可用于独立web项目开发,也可以用于与原生App混合(hybrid)开发. 源码地址 ...
随机推荐
- SQL SERVER 体系结构图
http://www.cnblogs.com/woodytu/p/4471386.html
- IntelliJ IDEA 给表达式赋变量名称
IntelliJ IDEA 给表达式赋变量名称 学习了:http://blog.csdn.net/tiny__wang/article/details/52988790 类似于Eclipse中的ctr ...
- CentOS出错You don't have permission to access on this server
检查http.conf发现没错之后.查找资料后发现时selinux的问题,所以须要关闭这个服务: 1 vi /etc/sysconfig/selinux 2 SELINUX=enforcing 改为 ...
- 【树状数组】POJ 2155 Matrix
附一篇经典翻译,学习 树状数组 http://www.hawstein.com/posts/binary-indexed-trees.html /** * @author johnsondu * @ ...
- Linux局域网搭建
系统版本号:Linux red hat 6.3 1. 打开ifcfg-eth0 # cd /etc./sysconfig/network-scripts # vim ifcfg-eth0 2. 改动i ...
- 飘逸的python - 极简的二叉树前中后序通杀函数
对于任一结点.能够按某种次序运行三个操作: 訪问结点本身(N) 遍历该结点的左子树(L) 遍历该结点的右子树(R) 用来表示顺序,即,前序NLR/中序LNR/后序LRN. 以下我们用namedtupl ...
- WebSocket在Asp.Net中的例子
环境 以下代码环境要求:win8或win10, .net4.5+IIS8 部署到IIS8上面 转到 Windows程序和功能 -打开Windows功能里面 IIS选项启动4.5 和WebSocket支 ...
- [python基础] Flasky-表单WTForms支持的html字段和内建函数
WTForms 支持的HTML 标准字段如表4-1 所示.表4-1 WTForms支持的HTML标准字段字段类型 说 明StringField 文本字段T ...
- iOS社会化分享(干货)
一.苹果原生集成的社会化分享 1.哪些平台 (1)Twitter (2)FaceBook (3)Flickr (4)Vimeo (5)新浪微博 :iOS6 (6)腾讯微博 : iOS7 2.框架 : ...
- 原生JS---6
原生js学习笔记6——事件 事件对象 鼠标事件 event.clientX在可视区中,鼠标点击的x坐标 event.clientY在可视区中,鼠标点击的y坐标 示例: <!DOCTYPE htm ...