tencent cloud

  // language support en-US / zh-CN / ja-JP / ko-KR / zh-TW
  <UIKitProvider language={'en-US'}>...</UIKitProvider>

import React, { useState } from 'react';
import { UIKitProvider } from '@tencentcloud/uikit-base-component-react';

// language support en-US / zh-CN / ja-JP / ko-KR / zh-TW
const languageList = ['en-US','zh-CN','ja-JP','ko-KR', 'zh-TW']

export default function App() {
  // language setting
  const [currentLanguage, setCurrentLanguage] = useState('en-US');
  const changeLanguage = (language) => {
    setCurrentLanguage(language);
  };
  
  return (
    // select language
    // <div @click="changeLanguage('en-US')">English</div>
    <UIKitProvider language={currentLanguage}>
      ...
    </UIKitProvider>
  );
}

import React from 'react';
import { UIKitProvider, useUIKit } from '@tencentcloud/uikit-base-component-react';

// language support en-US / zh-CN / ja-JP / ko-KR / zh-TW
const languageList = ['en-US','zh-CN','ja-JP','ko-KR', 'zh-TW'];

export default function App() {
  return (
    // init language
    <UIKitProvider language='en-US'>
      <Child />
    </UIKitProvider>
  );
}

function Child() {
    const { language, setLanguage } = useUIKit();
    setLanguage('zh-CN');
    return <div>current language is {language}</div>
}

import React from 'react';
import { UIKitProvider, useUIKit } from '@tencentcloud/uikit-base-component-react';

export default function SampleChat() {
  return (
    // init language
    <UIKitProvider language='en-US'>
      <Child />
    </UIKitProvider>
  );
}

function Child() {
    const { t } = useUIKit();
    return <div>{t('TUIChat.No More')}</div>
}

import { UIKitProvider } from '@tencentcloud/uikit-base-component-react';

const additionalLanguageResource = [
  {
    lng: 'de',
    translation: {
      'TUIChat': {
        'No More': 'Nicht mehr',
      },
    },
  },
];

export default function App() {
  return (
    <UIKitProvider language="de" additionalLanguageResources={additionalLanguageResource}>
      <Child />
    </UIKitProvider>
  );
}

function Child() {
    const { t, language, setLanguage } = useUIKit();
    return <div>current language is {language}. {t('TUIChat.No More')}</div>
}