node package manager
Don’t reinvent the wheel. Reuse code within your team. Create a free org »

vue-translate

Vue Translate

A translator directive for Vue.

The Basics

var Vue = require('Vue');
var translate = require('vue-translate');
Vue.use(translate);
 
// the messages data 
translate.messages = {
  "hello": "你好"
};

Use as directive

The v-trans directive will translate title, arial-label, alt and text content automaticly.

<div v-trans title="hello">hello</div>
 
<!-- will be translated to -->
<div title="你好">你好</div>

Translate more attributes

If the message you want to translate is not on the default attributes, e.g. data-message, you can pass it to v-trans.

<div v-trans="data-message" data-message="hello">hello</div>
 
<!-- will be translated to -->
<div data-message="你好">你好</div>