关键词搜索

源码搜索 ×
×

iView里的日期控件(DatePicker)范围初始化

发布2021-08-06浏览1105次

详情内容

iView里有个日期控件:DatePicker,功能很强,还支持时间范围,太贴心了。照以往,一般是要设置2个时间选取控件的。
在这里插入图片描述
但问题是,如何用初始值去初始化它呢?
答案是赋给它一个时间数组,数组2个元素,一个开始时间,一个结束时间,都是Date类型。

<FormItem label="预警日期" prop="dtRange">
  <DatePicker
    type="datetimerange"
    format="yyyy年MM月dd日HH时mm分"
    v-model="form1.dtRange"
    placeholder="请选择预警日期范围"
  ></DatePicker>
</FormItem>

<script>
function getAlertDateRange (dt) {
  let st = new Date(dt.valueOf())
  st.setMinutes(0)//分钟清零

  let ft = new Date(st.valueOf())
  ft = new Date(ft.setDate(ft.getDate() + 1))//时间范围相隔1天
  return [st, ft] //返回一个日期数组
}

export default {
  data () {
    return {
      form1: {
        dtRange: getAlertDateRange(new Date()),
      }
    }
  }
}
</script>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29

相关技术文章

点击QQ咨询
开通会员
返回顶部
×
微信扫码支付
微信扫码支付
确定支付下载
请使用微信描二维码支付
×

提示信息

×

选择支付方式

  • 微信支付
  • 支付宝付款
确定支付下载