问答

iview datepicker type='daterange' 动态设置可选范围

作者:admin 2021-05-06 我要评论

当选择日期组件的开始时间以后,动态设置可选范围在一个月内,网上有通过.native来获取每次点击事件,但无法生效,事件只触发一次,选择时间的时候不触发了,有...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

当选择日期组件的开始时间以后,动态设置可选范围在一个月内,网上有通过.native来获取每次点击事件,但无法生效,事件只触发一次,选择时间的时候不触发了,有没有其他办法实现?
https://www.lanwuyaojiu.cn/bl...

<DatePicker ref="date" slot="extra"
          :value="time"
          :options="dateOption"
          @click.native="nativeClick"
          type="daterange"
          placement="bottom-end"
          placeholder="选择日期" style="width: 200px"></DatePicker>
    nativeClick() {
      const target = this.$refs['date'].$refs['pickerPanel']
      const { from, to } = target['rangeState']
      console.log(from, to)
      if (from && ! to) {
        this.dateOption = {
          disabledDate(value) {
            const startTime = new Date(from)
            const endTime = new Date(from)
            startTime.setDate(from.getDate() - 30)
            endTime.setDate(from.getDate() + 30)
            return !(value >= startTime && value <= endTime)
          }
        }
      } else {
        this.dateOption = {
          disabledDate() {
            return false
          }
        }
      }
    }
###

你好 请问你搞定了吗 我也是要实现这个功能

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • iview datepicker type='daterange' 动

    iview datepicker type='daterange' 动

  • vue中引入less、less-loader、vue-load

    vue中引入less、less-loader、vue-load

  • wepy2.0小程序怎么使用iconfont?本人使

    wepy2.0小程序怎么使用iconfont?本人使

  • npm发布组件库怎么配置webpack?

    npm发布组件库怎么配置webpack?

腾讯云代理商
海外云服务器