expo-router中useLocalSearchParams无法获取参数问题求助

问题核心 #

你的路由结构与跳转方式不匹配，导致参数无法正确传递到[recentSearch].js组件：

• 当前动态路由app/[recentSearch].js对应路径为/[recentSearch]，但你的跳转代码要么路径格式错误（双斜杠//），要么指向根路径/（对应index.js），参数自然无法传递到目标组件。

解决方案 #

方案1：适配现有路由结构，正确传递参数 #

修改跳转代码，明确指向[recentSearch]路由并通过params传递参数：

<TouchableOpacity
  onPress={() => router.push({ 
    pathname: '/[recentSearch]', 
    params: { category, type } 
  })}
  activeOpacity={0.7}
>

此时[recentSearch].js中使用useLocalSearchParams()即可正常获取参数：

const { category, type } = useLocalSearchParams();
console.log(category, type); // 输出传递的参数值

方案2：调整路由结构为动态分段路由（若需路径显示为/category/type） #

如果希望URL路径直接显示为/你的category值/你的type值，调整文件结构：

• 新建目录结构：app/[category]/[type].js
• 修改跳转代码：

<TouchableOpacity
  onPress={() => router.push({ 
    pathname: `/${category}/${type}` 
  })}
  activeOpacity={0.7}
>

在app/[category]/[type].js中获取参数：

const { category, type } = useLocalSearchParams();
console.log(category, type); // 正常输出参数

关键说明 #

• expo-router中，动态路由文件（如[xxx].js）对应路径为/[xxx]，参数需通过params传递或作为路径分段。
• 根路径/对应app/index.js，向该路径传递的参数只能在index.js中获取，无法传递到[recentSearch].js。

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