Skip to content

Fix locale path for Navbar.#1034

Merged
huacnlee merged 1 commit into
mainfrom
endless/task-22
May 22, 2026
Merged

Fix locale path for Navbar.#1034
huacnlee merged 1 commit into
mainfrom
endless/task-22

Conversation

@endless-bot
Copy link
Copy Markdown
Collaborator

🤖 Auto-generated by Endless task #22.

Initiated by: Huacnlee Li Huashun

背景

开发者文档站(open.longbridge.com)支持三种语言:英文(根路径)、简体中文(/zh-CN/...)和繁体中文(/zh-HK/...)。用户切换语言后,页面 URL 会携带对应的语言前缀,但 AppNav 顶部导航栏中的链接(Docs、Pricing、CLI、MCP、Skill、品牌 Logo 等)及 FeaturesMenu 功能下拉菜单中的链接,始终指向英文根路径,而非当前语言路径。这意味着在中文页面点击导航链接会跳回英文版本,用户体验不连贯。

根因

utils/i18n.ts 中的 localePath() 函数通过读取 window.location.pathname 来判断当前语言前缀。这个读取行为不是 Vue 响应式依赖——Vue 的响应式系统无法追踪它,因此模板中调用 localePath(href) 的绑定不会在语言变化时自动重新求值。

更关键的是,VitePress 在静态生成阶段(SSR)渲染各语言页面时,isServer() 返回 truelocalePath() 直接原样返回路径,不添加任何语言前缀。预生成的 zh-CN / zh-HK 页面 HTML 中,导航链接因此全部是无前缀的英文路径。客户端水合时,若没有响应式依赖触发重新渲染,这些链接便保持错误状态。

摘要

  • 解决的问题:zh-CN / zh-HK 页面的 AppNav 导航链接及 FeaturesMenu 功能菜单链接不携带语言前缀,导致点击后跳转回英文根路径。
  • 做了什么
    • utils/i18n.ts:新增 useLocalePath() composable,内部使用 VitePress useData().localeIndex(响应式 ref)计算语言前缀,取代直接读取 window.location.pathname
    • AppNav.vue:将 localePath 的静态导入替换为 useLocalePath composable,在 setup 中调用获得响应式路径函数
    • FeaturesMenu.vue:同上,替换为 useLocalePath composable
  • 为什么这样做
    • localeIndex 是 VitePress 内置的响应式 ref,SSR 阶段也能正确返回当前语言键('root' / 'zh-CN' / 'zh-HK'),从根本上消除 SSR 预生成时的无前缀问题
    • composable 返回的是普通函数而非 computed ref,在模板绑定中调用时,Vue 渲染 effect 会自动追踪 localeIndex.value 作为依赖,无需额外包裹
    • 保留原有 localePath 导出不变,其他调用方(如 NewHomePage/index.vue)无需修改
  • 如何验证bun run dev 后访问 /zh-CN/docs,检查 AppNav 所有链接 href 是否包含 /zh-CN/ 前缀;访问 /zh-HK/docs 重复检查;开发者工具控制台无 Vue hydration 警告

修改

文件 改动内容
docs/.vitepress/theme/utils/i18n.ts 新增 useLocalePath() composable,使用 useData().localeIndex 响应式计算语言前缀
docs/.vitepress/theme/components/AppNav.vue localePath 静态导入替换为 useLocalePath,在 setup 中调用
docs/.vitepress/theme/components/FeaturesMenu.vue localePath 静态导入替换为 useLocalePath,在 setup 中调用

关键决策

使用 localeIndex(值为 'root' / 'zh-CN' / 'zh-HK')而非 lang(值为 'en-US' / 'zh-CN' / 'zh-HK')计算 URL 前缀,因为 localeIndex 的值与 VitePress locales 配置键完全对应,英文根路径用 'root' 表示而非 'en',映射逻辑更直接,不需要额外的字符串转换。

Generated by Endless task #22.

Co-authored-by: Huacnlee Li Huashun <huacnlee@longbridge-inc.com>
@huacnlee huacnlee changed the title developers AppNav 里面的链接没有跟随当前语言 Fix locale path for Navbar. May 22, 2026
@huacnlee huacnlee merged commit 5381239 into main May 22, 2026
2 checks passed
@huacnlee huacnlee deleted the endless/task-22 branch May 22, 2026 03:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants