VueTranslate
A VueJS (1.x, 2.0+) plugin for basic translations.
What is this?
Is a plugin to handle basic translations for your components, it adds a mixin and a directive to handle it the most comfortable way.
Like Vue-i18n?
Yes and no, Vue-i18n is a great plugin and is a lot more complete than this. This handle translations too, but is a more basic idea and smaller file (is just one file!).
What to expect?
Just translations, it is that simple.
Example
;; Vue; var myComp = Vue; var vm = el: '#app' components: myComp template: `<div> <my-comp></my-comp> </div>`;
Usage
Loading translations
You can do this in three different ways:
- A
locales
option in your component:
Vue
- Inside a component's method:
Vue;
- Globally when loading the plugin:
Vue; Vue;
Changing the language to use
Use the setLang
method of the $translate
property, like this:
Vue;
Events
You can listen to custom events emitted by the $translate
property:
this$translate
Parameters
You can use the method textWithParams
if you would like to insert parameters in your translation strings.
this$translate // In locales.js'translation.string': 'My name is %keyA%. My brother is named %keyB%.' // Result'My name is Glenn. My brother is named John.'
language:init
When the first language is set.
language:changed
When the language to use was changed from the previous value.
language:modified
Everytime a language is changed, either is the first time or not.
locales:loaded
When locales are loaded either by any of the 3 options