brockpetrie / vue-moment

Handy Moment.js filters for your Vue.js project.
MIT License
1.31k stars 121 forks source link

Problem setting global locale in laravel-vue project #109

Open GabotronES opened 5 years ago

GabotronES commented 5 years ago

I'm trying to set the global locale to 'es' but it's not taking effect, I'm using this module in a laravel-vue application so I'm doing this in my app.js

window.Vue = require('vue');
Vue.use( require('vue-moment') );
Vue.config.productionTip = false;

//posts
Vue.component('posts-list', require('./components/posts/PostsList.vue'));
Vue.component('posts-card', require('./components/posts/PostsCard.vue'));
Vue.component('posts-header', require('./components/posts/PostsHeader.vue'));
Vue.component('posts-sidebar-list', require('./components/posts/PostsSidebarList.vue'));
Vue.component('posts-bottombar-list', require('./components/posts/PostsBottombarList.vue'));
//reviews
Vue.component('reviews-card', require('./components/reviews/ReviewsCard.vue'));
//others
Vue.component('faq-list', require('./components/others/FaqList.vue'));
Vue.component('details-container', require('./components/others/DetailsContainer.vue'));
//auth
Vue.component('register-form', require('./components/auth/RegisterForm.vue'));
Vue.component('login-form', require('./components/auth/LoginForm.vue'));

import store from './store';
import "./directives"

const app = new Vue({

    el: '#vueapp',
    store,

    created () {
        console.info('******* VUE INSTANCE MOUNTED *******');
        this.$moment.locale('es');
    },

});
BrockReece commented 5 years ago

I think you need to require the respective locale module too. Try adding this line to the top of your file.

require('moment/locale/es')
carlosgeos commented 5 years ago

The components do not auto update, do:

this.$forceUpdate() to update the component after doing $this.$moment.locale('es')

desmartDev commented 5 years ago

It works like that

import moment from 'moment'

const lang = 'fr'

moment.locale(lang)

Vue.use(require('vue-moment'), {moment})

console.log(Vue.moment().locale()) // fr

export default new Vue({ el: '#app', render: h => h(App), created () { console.log(this.$moment().locale()) // fr } })