【问题标题】:data is duplicated when i come back to the same page again当我再次返回同一页面时,数据重复
【发布时间】:2019-05-15 21:05:15
【问题描述】:

我正在使用 ionViewWillEnterionViewWillLeave 作为我的 ionic 项目页面的生命周期挂钩,但在某些页面中,如果我导航到另一个页面并返回到该页面,则会复制数据。它将在ionViewWillEnter 中获取的新数据添加到旧数据中。

我需要做的是设置ionViewWillLeave 以确保所有旧获取的数据都消失了。

这是我的代码:

import { Component, OnInit, OnDestroy } from '@angular/core';
import { LanguageService } from '../services/language.service';
import { Dress, DressService } from '../services/dress.service';
import { AuthService } from '../services/auth.service';

@Component({
  selector: 'app-my-ads',
  templateUrl: './my-ads.page.html',
  styleUrls: ['./my-ads.page.scss'],
})
export class MyAdsPage {
  allDress: Dress[];
  theSub: any;
  currentEmail = '';

  constructor(
    private currentLanguage: LanguageService,
    private dressService: DressService,
    private authService: AuthService,
  ) {
    this.currentEmail = this.authService.userDetails().email;
  }

  ionViewWillEnter() {
    this.theSub = this.dressService.getDressesForMyAds().subscribe(res => {
      this.allDress = res;
    });
    console.log('myAds started');
  }
  ionViewWillLeave() {
    this.theSub.unsubscribe();
    console.log('myAds leaved');
  }

  getCurrentLanguage() {
    return this.currentLanguage.getCurrentLanguage();
  }

  changeToArabic() {
    this.currentLanguage.changeToArabic();
  }

  changeToEnglish() {
    this.currentLanguage.changeToEnglish();
  }

}

【问题讨论】:

    标签: angular ionic-framework ionic4 lifecycle


    【解决方案1】:

    我不得不删除 ionViewWillLeave 并用这个来改变它:

      ngOnDestroy() {
        this.theSub.unsubscribe();
        console.log('myAds leaved');
        // tslint:disable-next-line: forin
        for (const member in this.allDress) { delete this.allDress[member]; }
      }
    

    在学习之前删除获取数据修复了这一切。 for (const member in this.allDress) { delete this.allDress[member]; }

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2019-10-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-02-14
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多