ionic 4 router.navigate с navigationExtras не перезаписывает queryParams в некоторых случаях - PullRequest
Новая
       27

ionic 4 router.navigate с navigationExtras не перезаписывает queryParams в некоторых случаях

0 голосов
/ 27 февраля 2019

У меня есть приложение для инвентаризации (устройство и браузер), где пользователь может вести инвентаризацию деталей для хобби.У меня есть панель инструментов, которая показывает категории деталей (корзины для деталей).Если вы щелкнете по категории, вы увидите детали внутри категории, а затем, если вы нажмете на деталь, вы перейдете на страницу детали.

TL: DR;внизу.

Панель инструментов -> Бункеры -> Деталь

Я работаю с Router и navigationExtras, чтобы изменить queryParams, и у меня возникают некоторые странные проблемы.Я добавляю queryParams к URL, чтобы пользователь мог добавить в закладки или скопировать / вставить URL, если он находится в браузере.

На странице панели инструментов, когда я нажимаю на корзину, я получаю "корзину"Категория "и отправьте это как queryParam на страницу с корзинами: 

  goToBin(type) {
    const navigationExtras = {
      queryParams: {
        type: (type) ? type : 'all',
      }
    };
    console.log('Go To Bin:', type, navigationExtras);
    this.router.navigate(['dashboard/bins'], navigationExtras);
  }

Это прекрасно работает, когда я попадаю на страницу с корзинами, я получаю queryParams и быстро вызываю мой сервис наполучить части в массиве, которые относятся только к этой категории: 

  ionViewWillEnter() {
    this.route.queryParams.subscribe(params => {
      console.log('Received on Bin Page:', params);
      this.type = params['type'];
    });
    this.database.initDatabase(); // Only fires when loading this page fresh
    this.getBinParts();
  }

Это прекрасно работает.Затем на той же странице я отправлю еще один queryParam с идентификатором детали на страницу детали и в основном сделаю то же самое с массивом деталей:

Страница Bins - Отправка queryParams на страницу деталей 

  goToPart(part) {
    const navigationExtras = {
      queryParams: {
        pid: part.id,
        fromBin: true,
      }
    };
    console.log('Go To Part', part, navigationExtras)
    this.router.navigate(['dashboard/part'], navigationExtras);
  }

Страница деталей, получение параметров из корзины (url) 

  ionViewWillEnter() {
    this.route.queryParams.subscribe(params => {
      console.log('Received on Part Page:', params);
      this.pid = params['pid'];
      this.fromBin = params['fromBin'];
    });
    this.database.initDatabase(); // Again, only fires if fresh
    this.getPart();
  }

Затем, возврат к странице корзин из частей: 

  goBack() {
    const navigationExtras = {
      queryParams: {
        type: this.part.data.type,
      }
    };
    console.log('Go Back To Bins:', this.fromBin, this.part.data.type, navigationExtras);
    if (this.fromBin) {
      this.router.navigate(['/dashboard/bins'], navigationExtras);
    } else {
      this.router.navigate(['/dashboard']);
    }
  }

и возврат к панели инструментов.из бункеров (обратите внимание, что здесь я очищаю queryParams) 

  goBack() {
    const navigationExtras = {}
    console.log('Go Back To Dashboard:', navigationExtras);
    this.router.navigate(['/dashboard'], navigationExtras);
  }

Все работает очень хорошо, если я ТОЛЬКО начинаю со страницы панели инструментов.Я загружаю в соответствующие бункеры и детали просто отлично.

TL; DR: проблема в том, когда я запускаю либо прямо на странице бина, либо на странице детали.Если я перейду непосредственно к бинарной странице (например, / dashboard / bins? Type = антенна), я смогу нормально перейти на панель мониторинга и на правильные страницы деталей, но если перейти к панели мониторинга и выбрать другой блок, я получу толькодетали в исходной корзине, даже если параметры запроса в URL обновлены.

Это происходит, если я сразу же перехожу на страницу деталей, но, кроме того, я не вижу другие детали, если возвращаюсь кстраница деталей с другим идентификатором.

Я вижу, что он не получает новый параметр, который я отправил через журналы консоли.По порядку я посмотрю: 

Go To Part {id: "85Xry68VpFN5BMfh9hGu", data: {…}} {queryParams: {…}}
Received on Part Page: {pid: "bHg19fRKW2YNXgzS2Umk", fromBin: "true"}

Как видите, я отправляю идентификатор 85x... и получаю предыдущий идентификатор bHg...

Кэшируется ли этот queryParam?и если да, то как мне его уничтожить?Кроме того, почему это происходит только тогда, когда я перехожу непосредственно на эти дочерние страницы?

...