0π
Is not possible to use a PHP helper inside JavaScript. But, you can create an object of translations.
In your AppServiceProvider
(you can create a new one if you want):
// Don't forget to import the facade
use Illuminate\Support\Facades\Lang;
public function boot() {
$translations = [
'auth' => Lang::get('auth'),
'pagination' => Lang::get('pagination'),
'passwords' => Lang::get('passwords'),
'validation' => Lang::get('validation'),
];
view()->share('translations', json_encode($translations));
}
In your HTML (I suggest header) you can just call:
window.app = {
translations: {!! $translations !!},
}
And to access using in JS, you can just do this, for example:
this.app.translations.auth.throttle // Too many login attempts. Please try again in :seconds seconds.
- [Vuejs]-VueJS β Display Input Image Kills Browser
- [Vuejs]-Migrating from webpack 2.7 to 4.1.1, noticed bad performance results
0π
I use vue-i18n for that. That way you should make its own dictionary.
I made a i18n/en.js
file;
module.exports = {
login: {
title: 'Login',
loginButton: 'Login',
emailInput: 'email',
passwordInput: 'password',
},
Form: {
title: 'Form',
}
}
and a i18n/hu.js
with the same variables in Hungarian. Then I made a i18n/map.js
file:
var en = require('./en.js');
var hu = require('./hu.js');
module.exports = {
en,
hu,
}
and finally, set it in vue.js
, check my app.js
file part:
require('./bootstrap'); // vue comes from here
import VueI18n from 'vue-i18n'
import dictionary from './i18n/map'
var localeTmp = document.documentElement.lang;
var locale = "hu";
if(localeTmp) {
locale = localeTmp
}
const i18n = new VueI18n({
locale: locale, // set locale
dictionary, // set map of dictionary
})
....
const app = new Vue({
el: 'app',
i18n,
});
Its a very elegant way.
and how I use in component? simple:
....
<md-input-container>
<md-icon>person</md-icon>
<label>{{ $t("loginForm.emailInput") }}</label>
<md-input email name="email" required v-model="email" />
</md-input-container>
....
- [Vuejs]-How to avoid redefining scope for function inside Vue?
- [Vuejs]-Using Concatenation in Import file using vue js
Source:stackexchange.com