123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425 |
- import{_ as t,a,q as s,k as d}from"./index.3fe853a6.js";const e={pageData:{title:"Internationalization",description:"",frontmatter:{},headers:[{level:2,title:"ConfigProvider",slug:"ConfigProvider",content:"ant-design-vue provides a Vue Component [ConfigProvider](/components/config-provider) for configuring ant-design-vue locale text globally."}],relativePath:"site/src/vueDocs/i18n.en-US.md",content:`# Internationalization
- The default language is English as of yet. If you want to use other languages, you can follow the instructions below.
- ## ConfigProvider
- ant-design-vue provides a Vue Component [ConfigProvider](/components/config-provider) for configuring ant-design-vue locale text globally.
- ConfigProvider does not include the internationalization of time components. You need to additionally import the internationalization files of the time library (dayjs, momentjs, date-fns, etc.). Below we have taken dayjs as an example.
- \`\`\`html
- <template>
- <a-config-provider :locale="locale">
- <App />
- </a-config-provider>
- </template>
- <script>
- import zhCN from 'ant-design-vue/es/locale/zh_CN';
- import dayjs from 'dayjs';
- import 'dayjs/locale/zh-cn';
- dayjs.locale('zh-cn');
- export default {
- data() {
- return {
- locale: zhCN,
- };
- },
- };
- </script>
- \`\`\`
- Note: \`fr_FR\` is the filename, follow below.
- Supported languages:
- | Language | Filename |
- | ------------------------ | -------- |
- | Arabic | ar_EG |
- | Azerbaijani | az_AZ |
- | Bulgarian | bg_BG |
- | Bangla (Bangladesh) | bn_BD |
- | Belarusian | by_BY |
- | Catalan | ca_ES |
- | Czech | cs_CZ |
- | Danish | da_DK |
- | German | de_DE |
- | Greek | el_GR |
- | English (United Kingdom) | en_GB |
- | English | en_US |
- | Spanish | es_ES |
- | Estonian | et_EE |
- | Persian | fa_IR |
- | Finnish | fi_FI |
- | French (Belgium) | fr_BE |
- | French (Canada) | fr_CA |
- | French (France) | fr_FR |
- | Irish (Ireland) | ga_IE |
- | Galician (Spain) | gl_ES |
- | Hebrew | he_IL |
- | Hindi | hi_IN |
- | Croatian | hr_HR |
- | Hungarian | hu_HU |
- | Armenian | hy_AM |
- | Indonesian | id_ID |
- | Italian | it_IT |
- | Icelandic | is_IS |
- | Japanese | ja_JP |
- | Georgian | ka_GE |
- | Kurdish (Kurmanji) | kmr_IQ |
- | Kannada | kn_IN |
- | Kazakh | kk_KZ |
- | Khmer | km_KH |
- | Korean | ko_KR |
- | Lithuanian | lt_LT |
- | Latvian | lv_LV |
- | Macedonian | mk_MK |
- | Malayalam (India) | ml_IN |
- | Mongolian | mn_MN |
- | Malay (Malaysia) | ms_MY |
- | Norwegian | nb_NO |
- | Nepal | ne_NP |
- | Dutch (Belgium) | nl_BE |
- | Dutch | nl_NL |
- | Polish | pl_PL |
- | Portuguese (Brazil) | pt_BR |
- | Portuguese | pt_PT |
- | Romanian | ro_RO |
- | Russian | ru_RU |
- | Slovak | sk_SK |
- | Serbian | sr_RS |
- | Slovenian | sl_SI |
- | Swedish | sv_SE |
- | Tamil | ta_IN |
- | Thai | th_TH |
- | Turkish | tr_TR |
- | Urdu (Pakistan) | ur_PK |
- | Ukrainian | uk_UA |
- | Vietnamese | vi_VN |
- | Chinese (Simplified) | zh_CN |
- | Chinese (Traditional) | zh_HK |
- | Chinese (Traditional) | zh_TW |
- See usage at [ConfigProvider](/components/config-provider).
- `,html:`<h1 id="Internationalization">Internationalization <a class="header-anchor" href="#Internationalization">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h1>
- <p>The default language is English as of yet. If you want to use other languages, you can follow the instructions below.</p>
- <h2 id="ConfigProvider">ConfigProvider <a class="header-anchor" href="#ConfigProvider">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>ant-design-vue provides a Vue Component <a href="/components/config-provider">ConfigProvider</a> for configuring ant-design-vue locale text globally.</p>
- <p>ConfigProvider does not include the internationalization of time components. You need to additionally import the internationalization files of the time library (dayjs, momentjs, date-fns, etc.). Below we have taken dayjs as an example.</p>
- <pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>template</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-config-provider</span> <span class="token attr-name">:locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>locale<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>App</span> <span class="token punctuation">/></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-config-provider</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>template</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">
- <span class="token keyword">import</span> zhCN <span class="token keyword">from</span> <span class="token string">'ant-design-vue/es/locale/zh_CN'</span><span class="token punctuation">;</span>
- <span class="token keyword">import</span> dayjs <span class="token keyword">from</span> <span class="token string">'dayjs'</span><span class="token punctuation">;</span>
- <span class="token keyword">import</span> <span class="token string">'dayjs/locale/zh-cn'</span><span class="token punctuation">;</span>
- dayjs<span class="token punctuation">.</span><span class="token function">locale</span><span class="token punctuation">(</span><span class="token string">'zh-cn'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
- <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
- <span class="token keyword">return</span> <span class="token punctuation">{</span>
- <span class="token literal-property property">locale</span><span class="token operator">:</span> zhCN<span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">;</span>
- <span class="token punctuation">}</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">;</span>
- </span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span>
- </code></pre>
- <p>Note: <code>fr_FR</code> is the filename, follow below.</p>
- <p>Supported languages:</p>
- <table>
- <thead>
- <tr>
- <th>Language</th>
- <th>Filename</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>Arabic</td>
- <td>ar_EG</td>
- </tr>
- <tr>
- <td>Azerbaijani</td>
- <td>az_AZ</td>
- </tr>
- <tr>
- <td>Bulgarian</td>
- <td>bg_BG</td>
- </tr>
- <tr>
- <td>Bangla (Bangladesh)</td>
- <td>bn_BD</td>
- </tr>
- <tr>
- <td>Belarusian</td>
- <td>by_BY</td>
- </tr>
- <tr>
- <td>Catalan</td>
- <td>ca_ES</td>
- </tr>
- <tr>
- <td>Czech</td>
- <td>cs_CZ</td>
- </tr>
- <tr>
- <td>Danish</td>
- <td>da_DK</td>
- </tr>
- <tr>
- <td>German</td>
- <td>de_DE</td>
- </tr>
- <tr>
- <td>Greek</td>
- <td>el_GR</td>
- </tr>
- <tr>
- <td>English (United Kingdom)</td>
- <td>en_GB</td>
- </tr>
- <tr>
- <td>English</td>
- <td>en_US</td>
- </tr>
- <tr>
- <td>Spanish</td>
- <td>es_ES</td>
- </tr>
- <tr>
- <td>Estonian</td>
- <td>et_EE</td>
- </tr>
- <tr>
- <td>Persian</td>
- <td>fa_IR</td>
- </tr>
- <tr>
- <td>Finnish</td>
- <td>fi_FI</td>
- </tr>
- <tr>
- <td>French (Belgium)</td>
- <td>fr_BE</td>
- </tr>
- <tr>
- <td>French (Canada)</td>
- <td>fr_CA</td>
- </tr>
- <tr>
- <td>French (France)</td>
- <td>fr_FR</td>
- </tr>
- <tr>
- <td>Irish (Ireland)</td>
- <td>ga_IE</td>
- </tr>
- <tr>
- <td>Galician (Spain)</td>
- <td>gl_ES</td>
- </tr>
- <tr>
- <td>Hebrew</td>
- <td>he_IL</td>
- </tr>
- <tr>
- <td>Hindi</td>
- <td>hi_IN</td>
- </tr>
- <tr>
- <td>Croatian</td>
- <td>hr_HR</td>
- </tr>
- <tr>
- <td>Hungarian</td>
- <td>hu_HU</td>
- </tr>
- <tr>
- <td>Armenian</td>
- <td>hy_AM</td>
- </tr>
- <tr>
- <td>Indonesian</td>
- <td>id_ID</td>
- </tr>
- <tr>
- <td>Italian</td>
- <td>it_IT</td>
- </tr>
- <tr>
- <td>Icelandic</td>
- <td>is_IS</td>
- </tr>
- <tr>
- <td>Japanese</td>
- <td>ja_JP</td>
- </tr>
- <tr>
- <td>Georgian</td>
- <td>ka_GE</td>
- </tr>
- <tr>
- <td>Kurdish (Kurmanji)</td>
- <td>kmr_IQ</td>
- </tr>
- <tr>
- <td>Kannada</td>
- <td>kn_IN</td>
- </tr>
- <tr>
- <td>Kazakh</td>
- <td>kk_KZ</td>
- </tr>
- <tr>
- <td>Khmer</td>
- <td>km_KH</td>
- </tr>
- <tr>
- <td>Korean</td>
- <td>ko_KR</td>
- </tr>
- <tr>
- <td>Lithuanian</td>
- <td>lt_LT</td>
- </tr>
- <tr>
- <td>Latvian</td>
- <td>lv_LV</td>
- </tr>
- <tr>
- <td>Macedonian</td>
- <td>mk_MK</td>
- </tr>
- <tr>
- <td>Malayalam (India)</td>
- <td>ml_IN</td>
- </tr>
- <tr>
- <td>Mongolian</td>
- <td>mn_MN</td>
- </tr>
- <tr>
- <td>Malay (Malaysia)</td>
- <td>ms_MY</td>
- </tr>
- <tr>
- <td>Norwegian</td>
- <td>nb_NO</td>
- </tr>
- <tr>
- <td>Nepal</td>
- <td>ne_NP</td>
- </tr>
- <tr>
- <td>Dutch (Belgium)</td>
- <td>nl_BE</td>
- </tr>
- <tr>
- <td>Dutch</td>
- <td>nl_NL</td>
- </tr>
- <tr>
- <td>Polish</td>
- <td>pl_PL</td>
- </tr>
- <tr>
- <td>Portuguese (Brazil)</td>
- <td>pt_BR</td>
- </tr>
- <tr>
- <td>Portuguese</td>
- <td>pt_PT</td>
- </tr>
- <tr>
- <td>Romanian</td>
- <td>ro_RO</td>
- </tr>
- <tr>
- <td>Russian</td>
- <td>ru_RU</td>
- </tr>
- <tr>
- <td>Slovak</td>
- <td>sk_SK</td>
- </tr>
- <tr>
- <td>Serbian</td>
- <td>sr_RS</td>
- </tr>
- <tr>
- <td>Slovenian</td>
- <td>sl_SI</td>
- </tr>
- <tr>
- <td>Swedish</td>
- <td>sv_SE</td>
- </tr>
- <tr>
- <td>Tamil</td>
- <td>ta_IN</td>
- </tr>
- <tr>
- <td>Thai</td>
- <td>th_TH</td>
- </tr>
- <tr>
- <td>Turkish</td>
- <td>tr_TR</td>
- </tr>
- <tr>
- <td>Urdu (Pakistan)</td>
- <td>ur_PK</td>
- </tr>
- <tr>
- <td>Ukrainian</td>
- <td>uk_UA</td>
- </tr>
- <tr>
- <td>Vietnamese</td>
- <td>vi_VN</td>
- </tr>
- <tr>
- <td>Chinese (Simplified)</td>
- <td>zh_CN</td>
- </tr>
- <tr>
- <td>Chinese (Traditional)</td>
- <td>zh_HK</td>
- </tr>
- <tr>
- <td>Chinese (Traditional)</td>
- <td>zh_TW</td>
- </tr>
- </tbody>
- </table>
- <p>See usage at <a href="/components/config-provider">ConfigProvider</a>.</p>
- `,lastUpdated:1748060269536}},r={class:"markdown"};function o(i,n,p,l,c,u){return d(),a("article",r,n[0]||(n[0]=[s(`<h1 id="Internationalization">Internationalization <a class="header-anchor" href="#Internationalization"><span aria-hidden="true" class="anchor">#</span></a></h1><p>The default language is English as of yet. If you want to use other languages, you can follow the instructions below.</p><h2 id="ConfigProvider">ConfigProvider <a class="header-anchor" href="#ConfigProvider"><span aria-hidden="true" class="anchor">#</span></a></h2><p>ant-design-vue provides a Vue Component <a href="/components/config-provider">ConfigProvider</a> for configuring ant-design-vue locale text globally.</p><p>ConfigProvider does not include the internationalization of time components. You need to additionally import the internationalization files of the time library (dayjs, momentjs, date-fns, etc.). Below we have taken dayjs as an example.</p><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>template</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a-config-provider</span> <span class="token attr-name">:locale</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>locale<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>App</span> <span class="token punctuation">/></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a-config-provider</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>template</span><span class="token punctuation">></span></span>
- <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript">
- <span class="token keyword">import</span> zhCN <span class="token keyword">from</span> <span class="token string">'ant-design-vue/es/locale/zh_CN'</span><span class="token punctuation">;</span>
- <span class="token keyword">import</span> dayjs <span class="token keyword">from</span> <span class="token string">'dayjs'</span><span class="token punctuation">;</span>
- <span class="token keyword">import</span> <span class="token string">'dayjs/locale/zh-cn'</span><span class="token punctuation">;</span>
- dayjs<span class="token punctuation">.</span><span class="token function">locale</span><span class="token punctuation">(</span><span class="token string">'zh-cn'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
- <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
- <span class="token keyword">return</span> <span class="token punctuation">{</span>
- <span class="token literal-property property">locale</span><span class="token operator">:</span> zhCN<span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">;</span>
- <span class="token punctuation">}</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">;</span>
- </span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span>
- </code></pre><p>Note: <code>fr_FR</code> is the filename, follow below.</p><p>Supported languages:</p><table><thead><tr><th>Language</th><th>Filename</th></tr></thead><tbody><tr><td>Arabic</td><td>ar_EG</td></tr><tr><td>Azerbaijani</td><td>az_AZ</td></tr><tr><td>Bulgarian</td><td>bg_BG</td></tr><tr><td>Bangla (Bangladesh)</td><td>bn_BD</td></tr><tr><td>Belarusian</td><td>by_BY</td></tr><tr><td>Catalan</td><td>ca_ES</td></tr><tr><td>Czech</td><td>cs_CZ</td></tr><tr><td>Danish</td><td>da_DK</td></tr><tr><td>German</td><td>de_DE</td></tr><tr><td>Greek</td><td>el_GR</td></tr><tr><td>English (United Kingdom)</td><td>en_GB</td></tr><tr><td>English</td><td>en_US</td></tr><tr><td>Spanish</td><td>es_ES</td></tr><tr><td>Estonian</td><td>et_EE</td></tr><tr><td>Persian</td><td>fa_IR</td></tr><tr><td>Finnish</td><td>fi_FI</td></tr><tr><td>French (Belgium)</td><td>fr_BE</td></tr><tr><td>French (Canada)</td><td>fr_CA</td></tr><tr><td>French (France)</td><td>fr_FR</td></tr><tr><td>Irish (Ireland)</td><td>ga_IE</td></tr><tr><td>Galician (Spain)</td><td>gl_ES</td></tr><tr><td>Hebrew</td><td>he_IL</td></tr><tr><td>Hindi</td><td>hi_IN</td></tr><tr><td>Croatian</td><td>hr_HR</td></tr><tr><td>Hungarian</td><td>hu_HU</td></tr><tr><td>Armenian</td><td>hy_AM</td></tr><tr><td>Indonesian</td><td>id_ID</td></tr><tr><td>Italian</td><td>it_IT</td></tr><tr><td>Icelandic</td><td>is_IS</td></tr><tr><td>Japanese</td><td>ja_JP</td></tr><tr><td>Georgian</td><td>ka_GE</td></tr><tr><td>Kurdish (Kurmanji)</td><td>kmr_IQ</td></tr><tr><td>Kannada</td><td>kn_IN</td></tr><tr><td>Kazakh</td><td>kk_KZ</td></tr><tr><td>Khmer</td><td>km_KH</td></tr><tr><td>Korean</td><td>ko_KR</td></tr><tr><td>Lithuanian</td><td>lt_LT</td></tr><tr><td>Latvian</td><td>lv_LV</td></tr><tr><td>Macedonian</td><td>mk_MK</td></tr><tr><td>Malayalam (India)</td><td>ml_IN</td></tr><tr><td>Mongolian</td><td>mn_MN</td></tr><tr><td>Malay (Malaysia)</td><td>ms_MY</td></tr><tr><td>Norwegian</td><td>nb_NO</td></tr><tr><td>Nepal</td><td>ne_NP</td></tr><tr><td>Dutch (Belgium)</td><td>nl_BE</td></tr><tr><td>Dutch</td><td>nl_NL</td></tr><tr><td>Polish</td><td>pl_PL</td></tr><tr><td>Portuguese (Brazil)</td><td>pt_BR</td></tr><tr><td>Portuguese</td><td>pt_PT</td></tr><tr><td>Romanian</td><td>ro_RO</td></tr><tr><td>Russian</td><td>ru_RU</td></tr><tr><td>Slovak</td><td>sk_SK</td></tr><tr><td>Serbian</td><td>sr_RS</td></tr><tr><td>Slovenian</td><td>sl_SI</td></tr><tr><td>Swedish</td><td>sv_SE</td></tr><tr><td>Tamil</td><td>ta_IN</td></tr><tr><td>Thai</td><td>th_TH</td></tr><tr><td>Turkish</td><td>tr_TR</td></tr><tr><td>Urdu (Pakistan)</td><td>ur_PK</td></tr><tr><td>Ukrainian</td><td>uk_UA</td></tr><tr><td>Vietnamese</td><td>vi_VN</td></tr><tr><td>Chinese (Simplified)</td><td>zh_CN</td></tr><tr><td>Chinese (Traditional)</td><td>zh_HK</td></tr><tr><td>Chinese (Traditional)</td><td>zh_TW</td></tr></tbody></table><p>See usage at <a href="/components/config-provider">ConfigProvider</a>.</p>`,10)]))}const _=t(e,[["render",o]]);export{_ as default};
|