时间戳

首页 > 解决方案 > 在 vuejs 中配置 flat-pickr 日期和时间？

javascript - 在 vuejs 中配置 flat-pickr 日期和时间？

问题描述

我正在研究平面选择器。现在到配置部分。我有两个字段：start date和end date. 我想当我选择时间start date默认为上午 12 点。并选择 的时间end date，默认为 12h PM

在此处输入图像描述

// start date
<flat-pickr
     id="campaign-startdate"
     v-model="model.startdate"
     class="form-control"
     :config="formatStartDate"
/>
// end date
<flat-pickr
     id="campaign-enddate"
     v-model="model.endDate"
     class="form-control"
     :config="formatEndDate"
/>

data() {
  return: {
    model:{
      startDate: null,
      endDate: null,
    },
    formatStartDate: {
        enableTime: true,
        dateFormat: 'd-m-Y H:i'
    },
    formatEndDate: {
      enableTime: true,
      dateFormat: 'd-m-Y H:i'
    }
  }
}

标签： javascriptvue.js

解决方案

您可以在配置中为每个选择器设置默认时间小时和分钟。

 configStartDate: {
    altFormat: "F j, Y",
    altInput: true,
    enableTime: true,
    defaultHour:0,
    
  },
  configEndDate:{
   altFormat: "F j, Y",
    altInput: true,
    enableTime: true,
    defaultHour:12,
    
  }

为 startdate设置defaultHour:0 ，为 enddate设置defaultHour:12

请参阅演示flatpickr的链接

推荐阅读