Change language datapicker

Level 56

any idea?

Yes, read their docs:

<template>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <date-picker v-model="date" :config="options"></date-picker>
      </div>
    </div>
  </div>
</template>

<script>
  // Import required dependencies 
  import 'bootstrap/dist/css/bootstrap.css';
  
  // Import this component
  import datePicker from 'vue-bootstrap-datetimepicker';
  
  // Import date picker css
  import 'pc-bootstrap4-datetimepicker/build/css/bootstrap-datetimepicker.css';
   
  export default {    
    data () {
      return {
        date: new Date(),
        options: {
            locale: moment.local('de'),
          format: 'DD/MM/YYYY',
          useCurrent: false,
        }       
      }
    },
    components: {
      datePicker
    }
  }
</script>

note: this code is from the docs, I just added the locale key to the options object returned in data()

From the second link

You must include moment-with-locales.js or a local js file.

Just for clarification, the second link is referenced in the first, and the third link is referenced in the second.

Also, from your code you were trying to mix vue-bootstrap-datetimepicker with the locale from vuejs-datepicker.

As they are different libraries, made by different people, you should not expect that mixing their configuration would work.

Instead prefer to read the docs from the libraries you are using.

1 like