로컬라이제이션

Editor 위젯은 로컬라이제이션을 지원하여, 개발자가 레이블, 메시지, 툴팁을 여러 언어로 표시할 수 있습니다. 이 기능은 다양한 언어를 사용하는 사용자를 대상으로 하는 애플리케이션에서 필수적입니다. 로컬라이제이션은 위젯에 사용자 정의 번역 세트를 구성하여 적용할 수 있습니다.

라이브러리는 세 가지 기본 제공 로케일을 제공합니다:

• 중국어
• 영어
• 독일어

사용자 정의 로케일을 적용할 수도 있습니다.

기본 로케일

영어 로케일이 기본으로 적용됩니다:

로케일 적용

기본 제공 로케일을 적용하려면, @svar-ui/svelte-core에서 Locale 객체를, @svar-ui/core-locales에서 로케일 패키지를, @svar-ui/editor-locales에서 기본 제공 로케일을 각각 import한 후, Locale 태그에 원하는 언어의 words 속성을 추가합니다.

예시:

import { Locale } from "@svar-ui/svelte-core";
import { cn } from "@svar-ui/editor-locales";
import { cn as cnCore } from "@svar-ui/core-locales";

<Locale words={{ ...cn, ...cnCore }}>

아래 구성은 Editor 위젯이 독일어로 텍스트를 표시하도록 합니다. myLang 객체에는 키-값 쌍이 포함되어 있으며, 키는 Editor에서 사용하는 기본 영어 문자열이고 값은 해당 독일어 번역입니다. Locale 컴포넌트는 Editor를 감싸며 지정된 번역을 적용합니다.

<script>
   import { Locale } from "@svar-ui/svelte-core";
   import { Editor } from "@svar-ui/svelte-editor";

  const myLang = {
   "This field is required": "Dieses Feld ist erforderlich",
   "Invalid value": "Ungültiger Wert",
   Yes: "Ja",
   No: "Nein",
   Save: "Speichern",
   Cancel: "Abbrechen",
};
</script>

<Locale words={{ editor:myLang }}>
  <Editor />
</Locale>

사용자 정의 로케일을 적용하려면, 사용자 정의 로케일 객체를 새로 생성하거나 기존 객체를 수정하고, 모든 Editor 텍스트 레이블에 대한 번역을 제공해야 합니다(원하는 언어로 작성 가능). core 및 calendar 컴포넌트(@svar-ui/core-locales)의 레이블도 추가해야 합니다. 자세한 내용은 Core 로컬라이제이션을 참조하십시오.

한국어 예시:

const ko = {
   editor: {
      "Invalid value": 잘못된 값,
      // other
   },
   core:{ ... },
   calendar: { ... }
};

관련 샘플: Locales