You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+6-75
Original file line number
Diff line number
Diff line change
@@ -3,7 +3,7 @@
3
3
> A very easy-to-use Vue.js plugin that provides multi-language support
4
4
5
5
### Dependencies
6
-
-VueJS 2.0+
6
+
-Vue.js 2.0+
7
7
8
8
### Installation
9
9
We have two methods of installation; you can use `npm` or a standalone.
@@ -78,42 +78,6 @@ Sometimes it's easier to use the component model of Vue to manage your languages
78
78
79
79
The vue-multilanguage plugin will first look at the `messages` option in the local component before looking at globally-defined messages.
80
80
81
-
You can also embed the default language directly into your template, as long as it has a `default` defined in the plugin's configuration. This can save you a lot of time if you are translating an existing site that didn't previously have localization.
82
-
83
-
```html
84
-
<template>
85
-
<pv-lang.hi>Hello</p>
86
-
</template>
87
-
<script>
88
-
exportdefault {
89
-
data() { return {} }
90
-
messages: {
91
-
pt: {
92
-
hi:'Olá'
93
-
}
94
-
}
95
-
}
96
-
</script>
97
-
```
98
-
99
-
Note that you can still use substitutions when defining default messages from your markup.
To change the language currently used by the system, change the `$ language` option value to any of its components, for example:
96
+
To change the language currently used by the system, change the `language` option value to any of its components, for example:
133
97
134
98
```js
135
-
this.$language='en'
99
+
this.language='en'
136
100
```
137
101
138
102
If you don't set a default language on the language object, the default language will be automatically picked up in the client browser. If no language can still be found or you're in a JavaScript environment outside the browser (such as Node.js), then the default language becomes the first language listed.
139
103
140
-
this.$language = 'en'
104
+
this.language = 'en'
141
105
142
-
As of version 2.2.3, the whole thing is to change the language by firing a `$emit` named `changeLang`, thus making it easier for children who change the language of the site to propagate a change to their parent, for example:
import LvSideMenu from './components/template/SideMenu.vue'
156
-
export default {
157
-
name: 'app',
158
-
components: { LvSideMenu },
159
-
methods: {
160
-
changeLanguage(lang) {
161
-
this.$language = lang
162
-
}
163
-
},
164
-
}
165
-
</script>
166
-
```
167
-
168
-
In the example given, the `App` component is the parent of `LvSideMenu`, this child will try to change the language of the site, then it will issue the `changeLang` event, which must be captured by the parent so that the language defined by the child is propagated .
169
-
170
-
171
-
**Note:** See that in `App` I have the `h1` hidden element, it makes use of the `v-lang` directive, because without it the component would not be updated.
172
107
173
108
### LocalStorage
174
109
@@ -178,11 +113,7 @@ As of version 2.2.3 of vue-multilanguage, we are writing the current language in
178
113
179
114
To help in the development and expansion of this repository take a FORK to your account, after you have made your modifications do a PULL REQUEST, it will be parsed and included here since it helps the plugin.
180
115
181
-
We have an example inside this repository, to execute it, run the commands:
182
-
183
-
npm run demo:install
184
-
npm run demo
185
-
116
+
Before your PR, run `npm run build` to transpile ES6 to ES5 file.
186
117
187
118
You can still contribute to the documentation, although your little one, support new languages, if you see something wrong in English correct it :)
0 commit comments