LanguageSwitcher

4개 언어 전환. 국기 없이 각 언어 이름으로.

개요

미리보기

예시 언어동작 줄이기

Language

variant

value

이름	타입	기본값	설명
`variant?`	`'select' \| 'links'`	`select`	select = 설정 화면의 네이티브 select, links = 랜딩 푸터의 링크 4개.
`value?`	`'ko' \| 'en' \| 'zh' \| 'es'`	`ko`	현재 언어. 주지 않으면 UI 언어.
`onLocaleChange?: (locale) => void`	—	—	기본 동작(centralby_locale 쿠키 + router.refresh)을 대신한다. 서버가 <html lang>을 바꾼다.
`hrefFor?: (locale) => string`	—	—	links 변형의 언어별 URL. 주면 그 링크로 이동한다.
`ref`	—	—	ref는 바깥 <div>로 전달된다.
그 밖의 속성	—	—	id, data-* 등 네이티브 div 속성은 바깥 래퍼로 간다. className·style·children은 받지 않는다.

예시

이렇게 · 이렇게 하지 않기

이렇게 각 언어는 자기 언어로 쓴다(한국어, English, 简体中文, Español).

이렇게 하지 않기 국기는 쓰지 않는다.

이렇게 하지 않기 언어를 바꿔도 사용자가 쓴 기록과 작업 제목은 번역하지 않는다.

이렇게 하지 않기 커스텀 드롭다운이나 메뉴로 만들지 않는다. 짧은 목록 선택은 네이티브 select다.

토큰과 속성

이름	타입	기본값	설명
`variant?`	`'select' \| 'links'`	`select`	select = 설정 화면의 네이티브 select, links = 랜딩 푸터의 링크 4개.
`value?`	`'ko' \| 'en' \| 'zh' \| 'es'`	`ko`	현재 언어. 주지 않으면 UI 언어.
`onLocaleChange?: (locale) => void`	—	—	기본 동작(centralby_locale 쿠키 + router.refresh)을 대신한다. 서버가 <html lang>을 바꾼다.
`hrefFor?: (locale) => string`	—	—	links 변형의 언어별 URL. 주면 그 링크로 이동한다.
`ref`	—	—	ref는 바깥 <div>로 전달된다.
그 밖의 속성	—	—	id, data-* 등 네이티브 div 속성은 바깥 래퍼로 간다. className·style·children은 받지 않는다.