ionic3开发(填坑)之路

1.懒加载的问题

        ionic3使用了懒加载,所以页面之间的跳转可以直接使用字符串,例如:[navPush]='"HomePage"',this.navCtrl.push('HomePage'),且不需要在app.module.ts中再申明;(申明后ionic build不会报错但是ionic build --prod会报错);

2.ios的顶部被覆盖的问题

        使用cordova-plugin-statusbar插件,在app.component.ts中,将statusBar.overlaysWebView(false),设为false;这样不太美观,可以根据不同的页面和不同的系统设置顶部padding值

也可以采用这个方法https://www.jianshu.com/p/bce20d9d86c1

3.修改标签属性

        想修改ionic中的某个标签属性例如ion-item最好修改其class,如:.item-ios下修改(最好定义个父级的类,这样不会影响其他的ion-item),不要直接修改ion-item,这样会不生效

4.Android物理返回键的问题

        在import { NavController, App,Slides,ActionSheetController,Keyboard,ToastController,Platform } from 'ionic-angular';引人platform,定义公共变量unregister:any,exiting: boolean = false;

 在ionViewDidEnter()中添加

this.unregister=this.platform.registerBackButtonAction((e:any)=>{

      if (this.keyboard.isOpen()) {//判断键盘是否为打开状态

        this.keyboard.close();

      }

      else if () {//不为首页时

        this.navCtrl.pop()

      }else{//为首页时

        this.showExit();

      }

    },200);

showExit() {

    if (this.exiting === true) {

      this.platform.exitApp();

    } else {

      this.exiting = true;

      let tt = this.toast.create({

        message: '再按一次退出应用程序',

        duration: 2000,

        position: 'bottom'

      });

      tt.present();

      setTimeout(() => {

        this.exiting = false;

      }, 2000);

    }

  }

如果想让上述方法在整个APP中使用的话直接加在app.component.ts中,如果想只在某个页面中生效的话,记得将上面的优先级200调大以覆盖之前定义的返回方法,还有在离开页面时记得注销该方法,不然会在整个APP页面中生效

ionViewWillLeave(){

    let out = this;

    out.unregister();

  }

具体可以查看ionic官网api中的platform下的registerBackButtonAction方法;

5.关于ionic视频播放的问题

        我是使用的videogular2这个插件,具体使用方法可以在videogular2官网中查看https://videogular.github.io/videogular2/docs/getting-started/,顺便吐槽下这个官网网络有问题老是进不去,如果在ionic项目里报错:rxjs_1.fromEvent is not a function的话,可以尝试将版本回退下,回退到6.1.0版本,在ios中会默认为全屏,如果不想全屏记得在video标签中加playsinline webkit-playsinline属性;

6.ion-segment标签失效的问题

        在支付页面调用外部软件再跳转到新页面中,ion-segment标签会失效,点击没有反应,例如:在支付页面调用支付宝支付成功后,跳转到订单页面时ion-segment点击会没有反应,其实是有反应的,但是页面没有更新,

解决方法首先在ts中引人

import { Component,ChangeDetectorRef } from '@angular/core';

import { NavController, NavParams,Content } from 'ionic-angular';

声明下@ViewChild (Content)content:Content ;

constructor(private cd: ChangeDetectorRef)

其次在ion-segment-button标签中添加一个方法(ionSelect)='refData()',

refData(){ 

            setTimeout(()=>{

                  this.cd.detectChanges();//在用户点击0.1秒后刷新页面

            },100);

}

插件篇:

1.cordova-plugin-file-opener2在Android8+中打不开apk

在config.xml中添加

         <platform name="android">

                          <config-file parent="/manifest" target="AndroidManifest.xml" xmlns:android="http://schemas.android.com/apk/res/android">

                                <uses-permission android:name="android.permission.REQUEST_INSTALL_PACKAGES" />

                        </config-file>

        </platform>

    其次下载插件至本地并修改源文件src/android/io/github/pwlin/cordova/plugins/fileopener2/fileopener2.java下110行,将if(Build.VERSION.SDK_INT < Build.VERSION.CODE.N)改成if(Build.VERSION.SDK_INT < 24);

具体可以查看https://www.jianshu.com/p/39e2a88fbeb7,方法就是转自这位博主的;

2.com-sarriaroman-photoviewer插件报错

        com-sarriaroman-photoviewer在ios中会出现闪退的问题,解决方法是将com-sarriaroman-photoviewer的版本回退到1.1.18,1.2.1的版本有问题,Android没有尝试过,不过Android在1.1.18中没有出现问题;

3.cordova-plugin-video-editor在Android中转码报错

        有个取巧的解决方法:打开src/android/VideoEditor.java,将243中的new CustomAndroidFormatStrategy(videoBitrate, fps, width, height), listener, videoDuration);删除即可,部分视频在ios中制作缩略图也会报错(我猜是视频处理过的问题),将缩略图的0秒改成第1秒即可;

4.cordova-plugin-media-capture插件闪退

        是因为ios的权限的问题,需要给相机权限

        <config-file parent="NSCameraUsageDescription" platform="ios" target="*-Info.plist">        

            <string>App需要您的同意,才能访问相机,以便。。。</string>

        </config-file>

        相册权限:

        <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryUsageDescription">

            <string>App需要您的同意,才能访问相册,以便。。。</string>

        </edit-config>

        写入权限:

        <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryAddUsageDescription">

            <string>App需要您的同意,才能写入相册,以便。。。</string>

        </edit-config>

        音频录制权限:

         <edit-config file="*-Info.plist" mode="merge" target="NSMicrophoneUsageDescription">

            <string>App需要您的同意,才能录制声音,以便。。。</string>

        </edit-config>

5.cordova-plugin-camera闪退

        方法同上,只不过去掉录制声音的权限;

6.cordova-plugin-camera在ios中不显示缩略图的问题或者只出现白色

        动态判断下是否为ios,当为ios时CameraOptions中设置destinationType为0即base64,Android设置为1;


***最后想说的一些话:

1.地图的插件我用的是调用高德的cordova-plugin-gaodelocation-chenyu插件;

2.支付宝的插件我用的是cordova-plugin-alipay-v2;

3.微信用的是cordova-plugin-wechatv2(微信图片分享部分安卓会闪退);

4.Android机我使用的是Chrome自带的调试工具打开网站便可:

Chrome://inspect/#devices,

连接手机

在控制台运行ionic build,cordova run Android;

ios可以直接使用xcode调试,插上usb连接手机,在

选择设备

中选择连接的设备,然后点击开始

开始调试


后台代码打印

在这里可以看见后台报错或打印的代码。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,937评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,503评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,712评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,668评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,677评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,601评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,975评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,637评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,881评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,387评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,971评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2 342