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)开发. 源码地址 ...
随机推荐
- .Net操作Excel —— NPOI
近期的两个项目都有关于NPOI的功能,经过了一点学习,自己也摸索了一会,感觉还有点意思.现在将部分代码分享一下.一部分是C#代码,一部分是VB.Net的,懒得修改了,基本上都是从项目文件中copy出来 ...
- CF410div2 D. Mike and distribution
/* CF410div2 D. Mike and distribution http://codeforces.com/contest/798/problem/D 构造 题意:给出两个数列a,b,求选 ...
- Spring MVC Beginner's Guide--应该看第二次
第一遍,就差WEBFLOW知识点没过了.. 真的值得好好再看第二次呢.. 样例工程算是比较多的啦. 学到真的不少..
- N天学习一个Linux命令之free
用途 查看系统内存(物理/虚拟/缓存/共享)使用情况 用法 free [-b | -k | -m | -g | -h] [-o] [-s delay ] [-c count ] [-a] [-t] [ ...
- mysql 源码 王恒 [mysql数据结构+mysql 执行计划]
http://blog.chinaunix.net/uid/26896862/cid-156733-list-1.html http://www.it168.com/redian/wangheng/
- Linq:Linq实例1..More
本文会不断更新应用实例. 需求1:对一个Rate列表的RateLevel属性求和,然后除以Rate列表的数量求平均值. 没有Linq的做法: Int rateLevel = ; foreach (Ra ...
- POJ2584_T-Shirt Gumbo(二分图多重最大匹配/最大流)
解题报告 http://blog.csdn.net/juncoder/article/details/38239367 题目传送门 题意: X个參赛选手,每一个选手有衣服大小的范围,5种大小的队服,求 ...
- Linux -- 内存控制之oom killer机制及代码分析
近期,线上一些内存占用比較敏感的应用.在訪问峰值的时候,偶尔会被kill掉,导致服务重新启动.发现是Linux的out-of-memory kiiler的机制触发的. http://linux-mm. ...
- oc42--引用计数器
/* main.m 堆里面的内存释放是根据引用计数器,所以就是操作引用计数器. 创建一个对象,对象里面就有一个引用计数器,有多少指针指向它. 引用计数器为0就释放.任何一个对象初始化时就是1,所以 { ...
- Java获取路径中的文件名(正则表达式)
Java获取路径中的文件名(正则表达式) 目标 在这个路径中我想得到model2 /E:/2017-02-21--SoftWare/github/test/Java/poiDemo_word2exce ...