Question

如何让bootstrap datetimepicker选择日期格式为DD / MM / YY.Below是我的代码。引用this SO answer。我创建了以下JSFiddle。截至目前，datepicker的结果与Fri Jan 12 2018 09:27:28 GMT+0300类似。以下是模板代码：

<div id="app" class="container">


 <h3>Bootstrap Datetimepicker (eonosdan) Sample</h3>
  <hr/>
  <div class="row">
    <div class="col-md-4">
      <label>Select Date</label>
      <vue-datetimepicker></vue-datetimepicker>     
    </div>
  </div>
</div>

<template id="dttemplate">
  <div class='input-group date'>
    <input type='text' v-model="value" class="form-control" />
    <span class="input-group-addon">
              <span class="glyphicon glyphicon-calendar"></span>
    </span>{{value}}
  </div>
</template>

JS组件如下：

Vue.component('vue-datetimepicker', {      
  template: '#dttemplate', 
        props: ['value'],
  mounted: function() {
    var vm = this
    var mycomp = $(this.$el).datetimepicker({format: 'DD-MM-YYYY'})
     mycomp.on('dp.change', function(e) {
      vm.value = e;
      app.$data.requestdate = e.date.format('DD-MM-YYYY');
      vm.$emit('change', vm.value)           
    })
  }
});

new Vue({
  el: '#app',
  data: {},
  methods: {requestdate:moment().format('DD-MM-YYYY')}
})

<div class="form-group">
   <date-picker v-model="requestdate"></date-picker>                                                    
</div>

从组件中取出props: ['value']并v-model="value"会导致datetimepicker格式正确。但这使得它在可重用性方面无用。

编辑：将我的代码更新到上面之后，它的工作类似于＆＃39;但它使该组件仅对单个datetimepicker有用。

如何选择日期格式？

0 个答案: