Typescript 离子2/3:一次显示启动屏幕
我有一个ionic应用程序,当我启动应用程序并显示主页时,会打开一个启动屏幕,问题是当我从一个页面返回到另一个主页时,启动屏幕会再次出现!我希望在应用程序启动时只显示一次 以下是html主页的代码:Typescript 离子2/3:一次显示启动屏幕,typescript,ionic-framework,ionic3,splash-screen,Typescript,Ionic Framework,Ionic3,Splash Screen,我有一个ionic应用程序,当我启动应用程序并显示主页时,会打开一个启动屏幕,问题是当我从一个页面返回到另一个主页时,启动屏幕会再次出现!我希望在应用程序启动时只显示一次 以下是html主页的代码: <div id="custom-overlay" [style.display]="splash ? 'flex': 'none'"> <div class="flb"> <div class="Aligner-item Aligner-item
<div id="custom-overlay" [style.display]="splash ? 'flex': 'none'">
<div class="flb">
<div class="Aligner-item Aligner-item--top"></div>
<img class="splash-screen-logo" src="img/logo.svg">
<div class="Aligner-item Aligner-item-bottom"></div>
</div>
</div>
<ion-header>
<ion-toolbar color="primary">
<div class="search-icon">
<ion-icon name="ios-search" icon-only>
</ion-icon>
</div>
<ion-title class="bartitle"><b>parrot</b><small class="city">.city</small></ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-card>
<img src="img/dirty.jpg">
<ion-fab (click)="ParrotToast();" class="pubplace" left buttom>
<img src="img/place.png">
</ion-fab>
<div class="row">
<div class="puboptions col col-33">
<ul class="row rowlist">
<li class="col">
<ion-icon class="col" name="md-ribbon"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-thumbs-up"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-share"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-more"></ion-icon>
</li>
</ul>
</div>
</div>
<ion-row>
<ion-col>
<ion-item class="pubinformation">
<ion-avatar item-start>
<img src="img/profile.jpg">
</ion-avatar>
<h3><b>Essie Bailey</b></h3>
<p> <small>ARTIST SPOTTER</small></p>
</ion-item>
</ion-col>
<ion-col>
<ion-item class="likes">
<ion-note text-center>
<b class="likenumber">3 likes</b>
</ion-note>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-item class="pubinformation">
<strong> Museé du Cinquantenaire</strong>
<small class="datepub">IL Y A 2 SEMAINES</small>
</ion-item>
<ion-col class="hashtagsdiv" padding width-10>
<p class="hashtags">#consectetur #adipiscing #elit #Aliquam #quis #ultrices #quam #at #interdum #ante</p>
</ion-col>
</ion-row>
</ion-card>
<ion-card>
<img src="img/dirty.jpg">
<ion-fab (click)="ParrotToast();" class="pubplace" left buttom>
<img src="img/place.png">
</ion-fab>
<div class="row">
<div class="puboptions col col-33">
<ul class="row rowlist">
<li class="col">
<ion-icon class="col" name="md-ribbon"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-thumbs-up"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-share"></ion-icon>
</li>
<li class="col">
<ion-icon class="col" name="md-more"></ion-icon>
</li>
</ul>
</div>
</div>
<ion-row>
<ion-col>
<ion-item class="pubinformation">
<ion-avatar item-start>
<img src="img/profile.jpg">
</ion-avatar>
<h3>Essie Bailey</h3>
<p> <small>ARTIST SPOTTER</small></p>
</ion-item>
</ion-col>
<ion-col>
<ion-item class="likes">
<ion-note text-center>
<b>3 likes</b>
</ion-note>
</ion-item>
</ion-col>
</ion-row>
<ion-row>
<ion-item>
<strong> Museé du Cinquantenaire</strong>
<small class="datepub">IL Y A 2 SEMAINES</small>
</ion-item>
<ion-col class="hashtagsdiv" padding width-10>
<p class="hashtags">#consectetur #adipiscing #elit #Aliquam #quis #ultrices #quam #at #interdum #ante</p>
</ion-col>
</ion-row>
</ion-card>
</ion-content>
有人能帮忙解决这个问题吗!谢谢。我认为您需要使用本地存储:
this.storage.get('splash').then((splash) => {
if (splash == undefined || splash == null) {
this.storage.set('splash', 'visit');
//show splash
}
});
将启动屏幕创建为单独的页面,然后使用setTimeout()将主页设置为rootPage。 在新创建的启动屏幕中使用以下代码。ts
ionViewDidLoad(){
setTimeout(() => {
this.navCtrl.setRoot(HomePage);
}, 2000);
}
在ionViewDidLoad()方法中?是的,您可以将它放在那里?
ionViewDidLoad(){
setTimeout(() => {
this.navCtrl.setRoot(HomePage);
}, 2000);
}