根据url中的语言前缀,处理站点显示的翻译语言

This commit is contained in:
tangly1024.com
2024-11-08 17:03:23 +08:00
parent 44d6756920
commit 4d7b0f550d
2 changed files with 13 additions and 29 deletions

View File

@@ -89,29 +89,7 @@ export function GlobalContextProvider(props) {
// 添加路由变化时的语言处理
useEffect(() => {
const handleRouteChange = (url) => {
// 从路径中提取语言前缀
const pathSegments = url.split('/')
const pathLang = pathSegments[1]
// 检查是否是有效的语言路径
if (pathLang === 'en' || pathLang === 'zh') {
const targetLang = pathLang === 'en' ? 'en-US' : 'zh-CN'
// 直接更新语言,不使用 localStorage
updateLang(targetLang)
updateLocale(generateLocaleDict(targetLang))
}
}
// 初始化时处理当前路径
handleRouteChange(router.asPath)
// 监听路由变化
router.events.on('routeChangeComplete', handleRouteChange)
return () => {
router.events.off('routeChangeComplete', handleRouteChange)
}
initLocale(router.locale, changeLang, updateLocale)
}, [router])
useEffect(() => {

View File

@@ -65,13 +65,19 @@ export function generateLocaleDict(langString) {
}
/**
* 初始化站点翻译
* 根据用户当前浏览器语言进行切换
* 站点翻译
* 借助router中的locale机制根据locale自动切换对应的语言
*/
export function initLocale(lang, locale, changeLang, changeLocale) {
export function initLocale(locale, changeLang, updateLocale) {
if (isBrowser) {
// 只使用 URL 参数,忽略 localStorage
const queryLang = getQueryVariable('locale') || getQueryVariable('lang')
// 根据router中的locale对象判断当前语言表现为前缀中包含 zh、en 等。
let pathLocaleLang = null
if (locale === 'en' || locale === 'zh') {
pathLocaleLang = locale === 'en' ? 'en-US' : 'zh-CN'
}
// 如果有query参数切换语言则优先
const queryLang =
getQueryVariable('locale') || getQueryVariable('lang') || pathLocaleLang
if (queryLang) {
const match = queryLang.match(/[a-zA-Z]{2}(?:-[a-zA-Z]{2})?/)
@@ -79,7 +85,7 @@ export function initLocale(lang, locale, changeLang, changeLocale) {
const targetLang = match[0]
changeLang(targetLang)
const targetLocale = generateLocaleDict(targetLang)
changeLocale(targetLocale)
updateLocale(targetLocale)
}
}
}