$ npm install vue-lang --save
import Vue from 'vue'
import Lang from 'vue-lang'
const locales = {
'en': require('./langs/en.json'),
'br': require('./langs/br.json'),
'nl': require('./langs/nl.json')
}
Vue.use(Lang, {lang: 'en', locales: locales})
Where en.json
is defined as:
{
"hello": "World",
"messages": "You have {0} {1} messages",
}
<p>Hello {{$lang.hello}}</p>
<p>{{$lang.messages | replace countmsg 'new'}}</p>
With:
{
"data": {
"countmsg": 5
}
}
Results in:
<p>Hello World</p>
<p>You have 5 new messages</p>
Vue.$setLang('nl')
this.$setLang('nl')
<ul>
<li v-for="lang in $langs" @click="$setLang(lang)">{{lang}}</li>
</ul>
<p>Hello {{$l('cities.amsterdam'}}</p>
@Haixing-Hu & @kazupon for inspiration