В Ionic 4 установка корневой страницы при выходе из системы является общим требованием во многих мобильных приложениях. Когда пользователь выходит из системы, важно перенаправить его на определенную страницу, например, на страницу входа или домашнюю страницу. В этой статье мы рассмотрим шесть различных методов достижения этой функциональности на примерах кода.

Метод 1: использование NavController

import { NavController } from '@ionic/angular';
// Inside your logout function
logout() {
  this.navCtrl.navigateRoot('/login');
}

Метод 2: использование Angular Router

import { Router } from '@angular/router';
// Inside your logout function
logout() {
  this.router.navigate(['/login']);
}

Метод 3. Использование компонента приложения

import { AppComponent } from 'src/app/app.component';
// Inside your logout function
logout() {
  const appComponentInstance = this.app.getRootNavs()[0].getActiveChildNavs()[0].parent;
  appComponentInstance.setRoot('/login');
}

Метод 4. Использование событий

import { Events } from '@ionic/angular';
// Inside your logout function
logout() {
  this.events.publish('user:logout');
}

В компоненте вашего приложения:

import { Events } from '@ionic/angular';
constructor(private events: Events) {
  this.events.subscribe('user:logout', () => {
    this.navCtrl.navigateRoot('/login');
  });
}

Метод 5: использование BehaviorSubject

import { BehaviorSubject } from 'rxjs';
// Create a shared service
@Injectable({
  providedIn: 'root'
})
export class AuthService {
  private loggedOut = new BehaviorSubject<boolean>(false);
  loggedOut$ = this.loggedOut.asObservable();
  logout() {
    // Perform logout logic
    this.loggedOut.next(true);
  }
}
// Inside your app component or any other component
import { AuthService } from './auth.service';
constructor(private authService: AuthService, private navCtrl: NavController) {
  this.authService.loggedOut$.subscribe(loggedOut => {
    if (loggedOut) {
      this.navCtrl.navigateRoot('/login');
    }
  });
}

Метод 6. Использование локального хранилища

// Inside your logout function
logout() {
  localStorage.clear();
  this.navCtrl.navigateRoot('/login');
}

Настройку корневой страницы при выходе из системы в Ionic 4 можно выполнить несколькими способами. В этой статье мы рассмотрели шесть различных методов, включая использование NavController, Angular Router, компонента приложения, событий, BehaviorSubject и локального хранилища. Каждый метод предлагает уникальный подход для достижения желаемой функциональности. Выберите метод, который лучше всего соответствует требованиям вашего приложения, и реализуйте его соответствующим образом.