Ionic 1 & 2 开发常见问题 Q&A
本文分享了在 Ionic 1 & 2 版本开发过程中常见问题的一些 Q&A,供慕课网同学或其他朋友参考。
原文发表于我的技术博客
1. 版本的问题
Ionic 2 目前属于快速迭代更新的版本,版本的更新会带来如文件结构和少许代码的变更,不过底层还是构建于 Angular 2 以及 22 版本后引入了 TypeScript 语言,所以整体的语法结构不会有太大的变化,建议直接安装最新的版本学习,如果需要安装和课程一样的 22 版本,请参见我的博客:在 Ionic 2 项目中强制使用 22 版本,如果学习的是最新的版本,请参见最新的文档查询最新的语法定义:Ionic 2.0 相关资料,特别是 ionic serve
出错的时候,请参见最新的环境安装文档。
2. 安装失败的问题
因为需要加载国外的资源,所以最推荐的安装方式就是FQ安装,FQ后可以避免掉很多的安装坑。
如何要通过 CNPM 进行安装,请参见博文:使用 CNPM 进行 Ionic 环境的安装与配置,不过 CNPM 安装会遇到国内源不同步时计算包的 HASH 值不一样而安装出错的情况。
3. 在 Ionic2 TypeScript 项目中导入第三方 JS 库
我已写成单独的博文,请参见:http://blog.parryqiu.com/2016/09/18/import_js_to_ionic2_ts_project/
4. 新版本中的生命周期定义
Ionic 2 更新到了 30 版本后,框架在全局对生命周期的命名做了改变,所以本文简单整理一下新的生命周期事件和说明如下。
官方文档地址在这里。
事件名称 | 事件说明 |
---|---|
ionViewLoaded | 页面加载完毕触发。该事件发生在页面被创建成 DOM 的时候,且仅仅执行一次。如果页面被缓存(Ionic默认是缓存的)就不会再次触发该事件。该事件中可以放置初始化页面的一些事件。 |
ionViewWillEnter | 即将进入一个页面变成当前激活页面的时候执行的事件。 |
ionViewDidEnter | 进入了一个页面且变成了当前的激活页面,该事件不管是第一次进入还是缓存后进入都将执行。 |
ionViewWillLeave | 将要离开了该页面之后变成了不是当前激活页面的时候执行的事件。 |
ionViewDidLeave | 在页面完成了离开该页面并变成了不是当前激活页面的时候执行的事件。 |
ionViewWillUnload | 在页面销毁和页面中有元素移除之前执行的事件。 |
ionViewDidUnload | 在页面销毁和页面中有元素移除之后执行的事件。 |
5. Ionic 各平台支持版本
5.1. Ionic 1
支持的平台以及版本
- iOS 7+
- Android 4.1
不过可以使用 crosswalk-webview 去适配一些老版本以及提高 WebView 的性能。
5.2. Ionic 2
支持的平台以及版本
- iOS 8+
- Windows 10 Universal App
- Android 4.4+
同样,如果你使用 crosswalk-webview 可以将 Android 的版本支持降低到 4.1 版本。
6. 没有 iOS 开发者账号如何部署到真机
请参见博文:没有 iOS 开发者账号的情况下部署到真机的方法
7. Ionic 1 开发过程中的参见问题 Q&A
版本 1 开发过程的常见问题,我单独整理成了博文:Ionic 开发中遇到的问题以及后期发布 iOS/Android 的方方面面,对于 Ionic 2 的学习也是具有参考意义的。
8. Ionic2 下处理 Android 设备下返回按钮的事件
请参见单独的博文:Ionic2 下处理 Android 设备下返回按钮的事件
9. 阻止事件冒泡
{% codeblock lang:html%}
<button (click)="myFunction($event, myParam)">Click Me</button
{% endcodeblock %}
{% codeblock lang:js%}
myFunction(event: Event, myParam: any){
event.preventDefault();
}
{% endcodeblock %}
10. 为什么没有 App 文件夹
项目初始化后要进行平台的添加,可以通过命令 ionic platform add ios
和 ionic platform add android
分别添加 iOS 平台和 Android 平台,添加后就可以看到 App 文件夹以及添加的对应平台。
11. 最新版本的安装注意点
官方最新的文档已经给出了最新的安装命令,注意安装 ionic 的时候已经不需要添加上 @beta
的后缀了。
官方链接:http://ionicframework.com/docs/v2/setup/installation/
安装命令:npm install -g ionic cordova
初始化命令:ionic start cutePuppyPics --v2
运行:ionic serve
12. 一些文档与开源项目
请参考博文:http://blog.parryqiu.com/2016/08/25/ionic_references/
作者:Parry
出处:http://www.cnblogs.com/parry/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
快速零配置迁移 API 适配 iOS 对 IPv6 以及 HTTPS 的要求
本文快速分享一下快速零配置迁移 API 适配 iOS 对 IPv6 以及 HTTPS 的要求的方法,供大家参考。原文发表于我的技术博客 零配置方案 最新的苹果审核政策对 API 的 IPv6 以及 HTTPS 都作了要求,那么如何快速进行适配呢? 这里就快速给大家分享一个站点:https://www.cloudflare.com/ 注意它其中有两个重要的功能,进行配置,迁移 DNS 即可,详细的使用请自行查阅文档或者直接在小密圈给我提问即可。 配置这两个选项后即可实现零配置快速符合 Apple 的 App 审核需求了。 高质量前端开发小密圈 DevOpenClub 一直致力于免费分享高质量的软件开发的相关视频教程,在每一门技术的学习交流过程中都和大家形成了一个非常明确的讨论圈。 之前一直都是 QQ 群、微信群进行讨论,刚好最近「小密圈」流行,而且「小密圈」很好地解决了群交流的很多缺点。 有价值的信息不能沉淀的问题,有了小密圈,分享的东西都可以沉淀下来,和论坛一样随时可以翻看; 可以直接进行提问获得解答; 随时可以过滤掉垃圾信息,而且不受群垃圾消息的轰炸; 付费永远都是过滤垃圾信息最好的...
- 下一篇
Ionic2 下处理 Android 设备下返回按钮的事件
原文发表于我的技术博客 本文分享了 Ionic2 下处理 Android 设备下返回按钮的事件,供参考。原文发表于我的技术博客 代码中我分享了如何捕捉 Ionic2 项目在 Android 设备下返回按钮事件,并在捕捉到的事件中可以灵活根据需求编写相关业务逻辑,如退出、返回等。 详细的逻辑处理参见下面代码即可。 {% codeblock lang:js%} import {Component} from '@angular/core'; import {Platform, ionicBootstrap} from 'ionic-angular'; import {StatusBar} from 'ionic-native'; import {TabsPage} from './pages/tabs/tabs'; import {App, NavController} from 'ionic-angular'; import {ViewChild} from '@angular/core'; @Component({ template: '<ion-nav #rootNavCont...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
-
Docker使用Oracle官方镜像安装(12C,18C,19C)
- Springboot2将连接池hikari替换为druid,体验最强大的数据库连接池
- CentOS8编译安装MySQL8.0.19
- Docker快速安装Oracle11G,搭建oracle11g学习环境
- SpringBoot2配置默认Tomcat设置,开启更多高级功能
- MySQL8.0.19开启GTID主从同步CentOS8
- CentOS7,8上快速安装Gitea,搭建Git服务器
- Jdk安装(Linux,MacOS,Windows),包含三大操作系统的最全安装
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果
推荐阅读
最新文章
- CentOS7,CentOS8安装Elasticsearch6.8.6
- SpringBoot2初体验,简单认识spring boot2并且搭建基础工程
- CentOS6,CentOS7官方镜像安装Oracle11G
- Docker使用Oracle官方镜像安装(12C,18C,19C)
- SpringBoot2配置默认Tomcat设置,开启更多高级功能
- 设置Eclipse缩进为4个空格,增强代码规范
- Mario游戏-低调大师作品
- MySQL8.0.19开启GTID主从同步CentOS8
- Windows10,CentOS7,CentOS8安装MongoDB4.0.16
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果