*问题描述

在第一次进入首页的时候能正确获取设备的宽度,但当页面跳转之后,再次回到首页,出现设备(获取DOM)的宽度为零,但是当前页面进行刷新之后就能正确的获取到宽度.

A 第一次进入页面的宽度

image.png

image.png

B 第二次进入页面的宽度

image.png

image.png

问题困扰了很久,但是一直都未找到问题所在,

****期间尝试了以下办法(均以失败告终)
1 修改ionic的页面缓存机制 失败!
2 修改页面的渲染时间 失败
3 通过不同的方法来获取设备和文档的宽度 失败

*****其他的方法

使用了ionic的NavController组件中提供的popToRoot()方法,找了一天的办法总于成功了(感动的落泪)

import { NavController } from "ionic-angular";
constructor(public navCtrl: NavController,){
    this.navCtrl.popToRoot(page);//page:指定的页面
}

//popToRoot()官网介绍的是使用该方法是无论是在那个堆栈,都将回到堆栈的根(觉得应该是页面的视图从新进行了渲染)
方法地址:https://ionicframework.com/docs/api/navigation/NavController/#remove

同时使用ionic中platform的提供的width()方法

import { Platform } from 'ionic-angular';
constructor(public platform:Platform){
    this.platform.height();//获取设备的宽度,
}

相关的方法:http://ionicframework.com/docs/api/platform/Platform/