Vue component which shows the flag of the country from which the language comes from
Get the package from NPM:
npm install vue-lang-code-flags --save
or
yarn add vue-lang-code-flags --save
Register LangFlag
component in your app. You can use two approaches:
- in
main.js
you can mount it as a global Vue component:
import Vue from 'vue';
import LangFlag from 'vue-lang-code-flags';
Vue.component('lang-flag', LangFlag);
- in a specific component (e.g.:
Component.vue
):
import LangFlag from 'vue-lang-code-flags';
new Vue({
components: {
LangFlag,
},
});
Then, after the proper mounting, in your template you can call it like this:
<lang-flag iso="en" />
<lang-flag iso="ja" :squared="false" />
<lang-flag iso="zh" title="Some title" />
Mandatory properties
Property | Description | Type | Value |
---|---|---|---|
iso | ISO 639-1 identifier of the language | String |
one of the values defined here |
Optional properties
Property | Description | Type | Default |
---|---|---|---|
squared | Squared flag | Boolean |
true |
title | Title | String |
null |
Here follows the list of the currently available flags. They are identified using the ISO 639-1 standard.
Language | Code |
---|---|
Arabic | ar |
Armenian | am |
Azerbaijani | az |
Belarusian | be |
Bengali | bn |
Bulgarian | bg |
Chinese | zh |
Catalan | ca |
Czech | cs |
Dutch | nl |
English | en |
Estonian | et |
French | fr |
German | de |
Greek | el |
Hausa | ha |
Hindi | hi |
Hungarian | hu |
Indonesian | id |
Italian | it |
Japanese | ja |
Javanese | jv |
Khmer | km |
Korean | ko |
Latvian | lv |
Malay | ms |
Marathi | mr |
Dutch | nl |
Persian | fa |
Polish | pl |
Portuguese | pt |
Romanian | ro |
Russian | ru |
Spanish | es |
Swahili | sw |
Tamil | ta |
Telugu | te |
Thai | th |
Turkish | tr |
Uzbek | uz |
Vietnamese | vi |
Please follow the guidelines here.