美文网首页我爱编程
Ionic2框架简介

Ionic2框架简介

作者: 漂_34c2 | 来源:发表于2018-05-31 13:46 被阅读0次

    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接口时,性能上也会出现问题。

    相关文章

      网友评论

        本文标题:Ionic2框架简介

        本文链接:https://www.haomeiwen.com/subject/dwsqsftx.html