React Native StackNavigator栈导航：如何跳过页面返回指定页面

我完全懂你的需求——从successOrFail.js触发回退时，不想回到上一级的game.js，而是直接跳回原本的question.js，还不能把新的question页面重复加到栈顶（毕竟那样栈里就会有两个question页面，完全不符合预期）。

下面给你两个实用的解决方案：

方案一：指定回退层级（简单直接） #

你的导航栈结构是：home -> level -> question -> game -> successOrFail，从successOrFail到目标页面question中间隔了1个页面（game），所以可以直接调用pop方法并指定回退步数：

// 在successOrFail.js的回退按钮点击事件中使用
this.props.navigation.pop(2);

这里的2表示从栈顶移除两个页面：先移除当前的successOrFail，再移除中间的game，直接回到栈里原本存在的question页面，完全契合你的需求。

方案二：重置导航栈（更稳妥，适配复杂场景） #

如果担心某些场景下页面栈结构会有变化，你可以用reset方法手动重置导航栈，只保留到question的层级：

this.props.navigation.reset({
  index: 2, // 对应栈内页面的索引：home是0，level是1，question是2
  routes: [
    { name: 'home' },
    { name: 'level' },
    { name: 'question' },
  ],
});

这个方法会直接把导航栈重置为你指定的结构，确保回退后的栈干净无冗余页面，适合页面跳转逻辑复杂的场景。

额外提醒 #

别再用navigate('question')啦，它的设计逻辑就是把新页面添加到栈顶，自然会出现你遇到的重复添加问题。上面两个方法都是直接操作已有的导航栈，不会新增页面，完美匹配你的需求~

内容的提问来源于stack exchange，提问作者oflcad