如何在 ionic 3 中禁用视图缓存答案

【问题标题】：How to disable view caching in ionic 3如何在 ionic 3 中禁用视图缓存
【发布时间】：2018-05-18 13:04:55
【问题描述】：

我们使用 ionic 3 和 d3js。我们在每个组件中有很多 d3.js 转换（我们认为这会占用大量内存）。应用程序最初对导航和内容呈现快速（快速）响应，但是在导航 5-10 个页面后，应用程序变得更慢。我们看到页面导航和内容呈现的滞后。我们认为这是因为图标 3 中的视图缓存（不确定图标 3 中是否启用了视图缓存）。

当用户点击导航按钮时，我们从 NavController 推送或弹出。有没有办法禁用视图缓存，以便无论用户在视图之间导航多少次，应用性能都相同？

"@ionic/app-scripts": "3.1.9", "@ionic-native/core": "4.7.0",

主页和图表页面之间的示例代码。

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  constructor(public navCtrl: NavController) {
    console.log('construct again');
  }

  showMigrationChart() {
    this.navCtrl.push(MigrationChart);
  }

  showColumnChart() {
    this.navCtrl.push(ColumnChart);
  }
}


@Component({
  selector: 'migration-chart',
  templateUrl: '../../common/chart.html'
})
export class MigrationChart implements OnInit {
  @ViewChild('appChart') private chartContainer: ElementRef;
  public chartName = 'Column Chart';

  constructor(public navCtrl: NavController) {
    console.log('MigrationChart construct again');
  }

  ngOnInit() {
    this.chartName = migrationEngine(this.chartContainer.nativeElement);
  }

  public onBackClick() {
    console.log('getViews length= '+ this.navCtrl.length());
    console.log('getViews = ', this.navCtrl.getViews());
    this.navCtrl.pop();
  }
}

【问题讨论】：

您是否尝试更改根页面而不是推送/弹出？尝试并比较结果。在angulars github上肯定有像你这样的已知问题：/

标签： ionic-framework ionic3

【解决方案1】：

Ionic 框架没有问题。在关闭页面/组件时，没有正确清理 javascript 计时器和导致应用程序变慢的 while 循环。我们更改了代码以在 ngOnDestroy 中进行清理，现在一切正常。

【讨论】：