Ionic2框架简介

Ionic是用来做什么的

Ionic是一款基于web开发技术的框架,为了使开发者更加高效快捷的开发移动端native APP而诞生的。

Ionic2的出现

于2017年年初发布,随着angular2框架的出现,Ionic也由原来基于angularjs框架升级到angular框架,同时考虑到对app的可维护性,也由原来的基于JavaScript升级到Typescript。

Ionic怎么用

安装Ionic Cli 和 Cordova

npm install -g cordova ionic

Ionic依赖ionic cli来创建工程,并通过cordova build并生成native app。
iOSAndroid需要配置一下相应的cordova

运行以下命令就可以创建一个Ionic项目工程了

ionic start MyIonicProject [init type]

MyIonicProject 是自己的工程目录名

  • tabs : 包含三个简单tab
  • sidemenu: 包含一个左边菜单
  • blank: 空页面
  • super: 完整的多功能小demo
  • tutorial: 项目引导工程

运行以下命令,启动工程

ionic serve

运行一下命令可以快速创建 pipes, components, pages, directives, providers, 和 tabs

ionic generate page MyPage 
或
ionic g page MyPage

介绍几个常用的API

NavController

NavController是一个控制页面跳转的基础组件,此组件类似一个栈,当前要显示的页面置于栈顶,回退时直接pop这个栈就行。

可以将此组件注入到除根组件之外其他组件中,用于控制页面跳转。

如果要在根组件下进行跳转,可以使用ion-nav组件,然后给它添加一个索引变量,通过@ViewChild获取ion-nav的一个实例,之后根组件就可以通过这个实例进行页面跳转了。

MenuController

MenuController控制菜单栏的组件。

常用的方法有:

  • close(menuId) 关闭菜单
  • enable(menuId) 使菜单有效/无效
  • open(menuId) 打开菜单
  • toggle(menuId) 切换菜单

兼容性

Android:完全兼容4.4以上的版本,对4.0.x以下的版本不做支持,之间的版本建议使用Crosswalk来解决兼容性

iOS:iOS 8+

性能

ionic程序跑在webview里面,所有的对底层硬件的访问都依赖cordova,所以对一些对交互和图形处理有高要求的App,会存在缺陷;同时,当需要调用大量native接口时,性能上也会出现问题。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容