Expo Router布局中，空依赖useEffect为何触发两次？

以下是几个可能导致该问题的原因：

• React 18 Strict Mode 触发重复执行
  React 18在开发环境下的Strict Mode会主动重复执行挂载阶段的生命周期函数（包括空依赖的useEffect），目的是检测组件中存在的挂载/卸载副作用问题。Expo默认在开发模式下启用Strict Mode，这是最常见的触发两次请求的原因。生产环境下Strict Mode会自动关闭，不会出现这个问题。

• 路由跳转逻辑重复触发
  检查(auth)/login.tsx中的重定向逻辑是否被执行了两次。比如如果重定向代码写在了无依赖的useEffect里，或者登录状态更新导致组件重渲染，进而重复触发重定向，会导致(tabs)/index.tsx被两次挂载，最终触发两次useEffect。

• 父布局组件重渲染导致子组件重复挂载
  查看(tabs)/_layout.tsx是否存在状态或props的频繁变化，比如全局用户状态在登录后多次更新，导致整个tabs布局重渲染，进而带动index.tsx组件重复卸载再挂载，触发两次useEffect。

• Expo Router版本兼容性问题
  部分旧版本的Expo Router在分组路由（如(auth)、(tabs)这类分组）之间跳转时，存在组件重复挂载的bug。可以尝试升级到最新的稳定版Expo Router来验证是否解决问题。

快速验证方法 #

1. 临时关闭Strict Mode：在app/_layout.tsx中移除<StrictMode>的包裹，查看useEffect是否只执行一次。如果恢复正常，即可确认是Strict Mode的原因。
2. 添加日志排查：在login.tsx的重定向代码、(tabs)/index.tsx的useEffect中添加console.log，观察日志输出次数，定位重复触发的环节。

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