Question

这是我的应用程序的简化流程：-

登录
主页（具有用于颜色图或创建图的选项）
colorInDiagram（用户为图表的各个部分上色）
makePayment
首页（返回首页）

现在，在此之后，如果用户决定再次为图表着色，他/她将从主页上选择该特定选项，然后流程将照常继续。发生这种情况的原因是，付款后，用户将返回首页（已加载），并且所有其他屏幕都会重置。随着应用程序全面发展。 ComponentWillUnmount在colorInDiagram中被调用。

我要处理的是：-

如果用户在执行第3步（为该图着色）时关闭了该应用程序，则在重新打开该应用程序时，我已对其进行了编码，以从退出该应用程序的位置恢复。但是，当用户完成着色和付款后，他/她不会返回到首页，因为应用直接从colorInDiagram组件启动。主页将首次加载。

因此，现在用户绑定从主页再次为图表着色时，它将加载colorInDiagram，因为它在用户继续付款之前就已被保留。（它只是推送组件，因为它当前在堆栈中存在）。在colorInDiagram中不会调用 ComponentWillUnmount。

预期的行为：-它应该是一个没有颜色填充的空白图表。好像是全新的安装，而不仅仅是重新渲染组件，因为上次使用时它被保留了。

*可能的解决方案：-*我觉得我将不得不手动卸载colorInDiagram组件。

问题：-如何手动卸载React Native组件。

此外，如果你们还有其他见解，问题估计或解决方案，请务必分享！

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);

如何在堆栈导航器中卸载先前安装的组件（react-navigation 2.X）？

这是我的应用程序的简化流程：-

我要处理的是：-

1 个答案: