Как отключить ранее смонтированный компонент в стековом навигаторе (response-navigation 2.X)?

Question

Это упрощенная схема моего приложения: -

1. вход
2. домашняя страница (имеет параметры для цветовой схемы или создания диаграммы)
3. colorInDiagram (пользовательские цветачасти диаграммы)
4. makePayment
5. домашняя страница (вернуться на главную страницу)

Теперь, после этого, если пользователь решит снова раскрасить диаграмму, он / она будетвыберите эту опцию на домашней странице, и процесс будет продолжаться как обычно.Это происходит потому, что после оплаты пользователь вернется на домашнюю страницу (которая уже загружена), и все остальные экраны будут сброшены.Как приложение идет по кругу. ComponentWillUnmount вызывается в colorInDiagram.

Что я пытаюсь обработать: -

Если пользователь закрывает приложение на шаге 3 (раскраска диаграммы), при повторном открытииприложение, я кодировал его, чтобы восстановить с того места, где приложение было остановлено.Но когда пользователь заканчивает раскрашивание и оплату, он / она не возвращает на домашнюю страницу, так как приложение напрямую запускается из компонента colorInDiagram .Домашняя страница загружается в первый раз.

Так что теперь, когда пользователь связывается, чтобы снова раскрасить диаграмму с домашней страницы, он загружает colorInDiagram, как он был прерван, прежде чем пользователь приступил к оплате.(Это просто выталкивает компонент, поскольку он существует в стеке в настоящее время). ComponentWillUnmount НЕ вызывается в colorInDiagram.

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

* Возможное решение: - * Мне кажется, что мне придется вручную размонтировать компонент colorInDiagram.

Вопрос: - Как вручную размонтировать реагирующий нативныйcomponent.

Кроме того, если у вас, ребята, есть какие-либо другие идеи, оценки проблем или решения, пожалуйста, поделитесь!

Answer 1

Только для того, чтобы его можно было принять в качестве ответа, вот решение, которое я предложил в разделе комментариев:

Вы можете использовать StackAction.reset метод: https://reactnavigation.org/docs/en/stack-actions.html#reset для сброса стека навигации, когда экранная визуализация colorInDiagram больше не находится в стеке, таким образом отключая компонент

Из документов:

Действие сброса стирает все состояние навигации и заменяетэто с результатом нескольких действий.

import { StackActions, NavigationActions } from 'react-navigation';

const resetAction = StackActions.reset({
  index: 0,
  actions: [NavigationActions.navigate({ routeName: 'Profile' })],
});
this.props.navigation.dispatch(resetAction);