iview中时间选择器可设置选择范围方法(一个月 一周等)

简介: iview中时间选择器可设置选择范围方法(一个月 一周等)
 <DatePicker
              type="datetimerange"
              :clearable="false"
              :options="options"
              :value='changeTime'
              placement="bottom-end"
              format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期"
              style="width: 200px"
              @on-change='tiemChange'></DatePicker>
data () {
  return {
                 changeTime: [getDate('yyyy-MM-dd 00:00:00'), getDate('yyyy-MM-dd 23:59:59')],
                  options: {
                    disabledDate (date) {
                      return date && date.valueOf() > Date.now()
                    }
                  },
  }
}
 // 选择日期变化
    tiemChange (event) {
      event[1] = event[1].replace(/00:00:00/, '23:59:59')
      const day = Math.floor((getTime(event[1]) - getTime(event[0])) / 86400000)
      if (day > 30) {
        // this.changeTime = [getDate('yyyy-MM-dd 00:00:00'), getDate('yyyy-MM-dd 23:59:59')]
        return this.$Message.error('日期范围最大选择30天')
      } else {
        this.changeTime = event
        this.getTableList(1)
      }
    },
相关文章
SwiftUI—方便用户选择日期的DatePicker日期拾取器
SwiftUI—方便用户选择日期的DatePicker日期拾取器
1452 0
SwiftUI—方便用户选择日期的DatePicker日期拾取器
|
5月前
|
JavaScript 前端开发 容器
js使用表格生成一个日历,点击按钮上查看上个月,点击按钮下,查看下个月,月份,年份
js使用表格生成一个日历,点击按钮上查看上个月,点击按钮下,查看下个月,月份,年份
63 0
|
6月前
|
JavaScript
vue 获取上一周和获取下一周的日期时间
vue 获取上一周和获取下一周的日期时间
46 0
|
6月前
lunar="false",日历插件不显示农历
lunar="false",日历插件不显示农历
35 1
|
JavaScript API
elementUI中的el-date-picker日期月份时间选择器禁用选中当前和以后的日期
elementUI中的el-date-picker日期月份时间选择器禁用选中当前和以后的日期
605 0
|
JavaScript 前端开发 UED
【组件封装】显示实时时间和星期几·附文字特效
【组件封装】显示实时时间和星期几·附文字特效
【组件封装】显示实时时间和星期几·附文字特效
uniapp的picker日期转时间戳多8小时问题
uniapp的picker组件前段时间用的时候发现一个很神奇的问题,就是选择后生成的时间戳会多出8小时
215 0