React Native中React Navigation 6返回上屏传参失效问题

你用navigation.navigate回跳已存在于导航栈的CreatePost页面时，踩了React Navigation的几个高频坑，才会导致参数监听不到：

• 部分6.x早期版本里，对栈内已存在的页面调用navigate加merge: true配置时，不会触发route.params的引用更新，useEffect依赖自然不会触发。
• 如果Screen B在嵌套子导航栈里，直接navigate父栈页面时，参数不会透传到父栈页面对应的route对象上，直接被丢弃。
• 你现在的写法没有显式关闭当前Screen B，本质是尝试往栈里再压一个同名的CreatePost页面，触发路由id冲突时参数会被直接忽略。

按优先级试下面的方法，基本覆盖所有同场景问题：

方案1：回调传参（最稳妥，社区通用方案） #

不要硬靠route.params传返回值，直接在跳转时传回调，完全绕开参数更新检测的问题：

1. 改Screen A跳转到Screen B的代码，把选中后的回调通过参数传给B：

// Screen A 跳转Screen B的逻辑
navigation.navigate('ScreenB', {
  handleSelectData: (data) => {
    // 这里直接拿到回传的选中数据，直接更新A页面状态即可
    console.log('接收到回传数据', data)
  }
})

2. 改Screen B的回退逻辑，选中后先调用回调再返回上一页：

// 记得先从useRoute拿到route对象
const route = useRoute()
const postSelected = (selectedData) => {
  const selectCallback = route.params?.handleSelectData
  if (selectCallback) selectCallback(selectedData)
  // 直接返回，不需要带参数navigate
  navigation.goBack()
}

这个写法不受导航版本、嵌套栈结构影响，不会出现监听不到的问题。

方案2：修正现有params传参逻辑 #

如果不想改回调写法，就调整现有代码的传参和监听逻辑：

1. 改Screen B的回退方法，先pop当前页再给上一页设置参数，不要用merge：

const postSelected = (selectedData) => {
  navigation.pop()
  navigation.setParams({
    postData: selectedData
  })
}

2. 改Screen A的useEffect监听逻辑，不要单独监听route.params?.postData，避免初始值为undefined时依赖收集失效，取完参数记得清空避免重复触发：

const route = useRoute()
useEffect(() => {
  if (route.params?.postData) {
    console.log('Sent 接收到参数', route.params.postData)
    // 处理完业务逻辑清空参数，防止后续页面进入重复触发
    navigation.setParams({ postData: undefined })
  }
}, [route.params])

如果改完还是不生效，先检查这两个低级问题：

• 确认Screen A里的route是通过useRoute()钩子拿到的，或者是屏幕组件props里传的route，不是自己随便定义的变量，很多人漏引入useRoute导致一直拿的是旧值。
• 如果你用的是React Navigation 7.x版本，栈内回跳到已存在页面时，navigate方法必须加popToScreen: true配置，明确告诉导航回到现有实例而不是新建页面：

navigation.navigate({
  name: 'CreatePost',
  params: { postData: selectedData },
  popToScreen: true
})

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