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)开发. 源码地址 ...
随机推荐
- 在django里用xlwt作EXCEL导出功能
参考了以前kevin的代码,搞起来快呀,哈哈哈,,阿里亚多.... 代码的意思比较明白,不注释,几乎自解释... 就是定义EXCEL时,比较硬生生的,一步一步没有快捷的方法. 另外就是取时间出来时,如 ...
- nyoj_264_国王的魔镜_201311271800
国王的魔镜 时间限制:3000 ms | 内存限制:65535 KB 难度:1 描述 国王有一个魔镜,可以把任何接触镜面的东西变成原来的两倍——只是,因为是镜子嘛,增加的那部 ...
- 洛谷 P1796 汤姆斯的天堂梦_NOI导刊2010提高(05)
P1796 汤姆斯的天堂梦_NOI导刊2010提高(05) 题目描述 汤姆斯生活在一个等级为0的星球上.那里的环境极其恶劣,每天12小时的工作和成堆的垃圾让人忍无可忍.他向往着等级为N的星球上天堂般的 ...
- Spring MVC-控制器(Controller)-参数方法名称解析器(Parameter Method Name Resolver )示例(转载实践)
以下内容翻译自:https://www.tutorialspoint.com/springmvc/springmvc_parametermethodnameresolver.htm 说明:示例基于Sp ...
- 改进MySQL Order By Rand()的低效率
Author:flymorn Source:飘易Categories:PHP编程 PostTime:2011-1-14 15:35:07 正 文: 最近由于需要研究了一下MYSQL的随机抽取实现方法. ...
- [Angulalr] Speed Up Reducer Development Using Ngrx Schematics
When we use NGRX, we need to create some bolipates. Now with Angulalr6, we can use CLI to generate t ...
- C语言指针实现字符串的反转
题目要求: 编敲代码:从键盘随意输入一个字符串,输出该字符串. 然后.将该字符串逆序存放后再输出,要求用字符指针完毕. 代码: //解法一 #include <stdio.h> #incl ...
- 支付宝即时到帐接口的python实现,演示样例採用django框架
因工作须要研究了支付宝即时到帐接口.并成功应用到站点上,把过程拿出来分享. 即时到帐仅仅是支付宝众多商家服务中的一个,表示客户付款,客户用支付宝付款.支付宝收到款项后,立即通知你,而且此笔款项与交易脱 ...
- Winform设计-小百货 涵盖基础插件学习(适合新手)
Winform设计-小百货 涵盖基础插件学习(适合新手) 第一次写winform,主要是为了加快对 事件的 理解. 代码如下: private void Form1_Load(object se ...
- ECharts-热力图实例
1.引入echarts.js 2.页面js代码 //用ajax获取所需要的json数据 $.get("../../../mall/queryPageWtSrPost.do", { ...