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中添加

        

                         

                                

                        

       

    其次下载插件至本地并修改源文件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的权限的问题，需要给相机权限

                

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

       

        相册权限：

        

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

       

        写入权限：

        

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

       

        音频录制权限：

         

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

       

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连接手机，在

选择设备

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

开始调试

后台代码打印

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