首页 > 其他分享 ># vue element-ui日期选择器限制90天范围

# vue element-ui日期选择器限制90天范围

时间:2022-12-08 11:24:47浏览次数:66  
标签:vue const getTime choiceDate 90 element 选择器

# vue element-ui日期选择器限制90天范围

<el-form-item label="开票时间">
              <el-date-picker
                v-model="listQuery.test"
                type="daterange"
                :picker-options="pickerOptions"
                size="small"
                class="date-item"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              />

> pickerOptions绑定js

pickerOptions: {
        onPick: ({ maxDate, minDate }) => {
          this.choiceDate = minDate.getTime()
          if (maxDate) {
            this.choiceDate = ''
          }
        },
        disabledDate: (time) => {
          if ((this.choiceDate) !== '') {
            const one = 90 * 24 * 3600 * 1000
            const minTime = this.choiceDate - one
            const maxTime = this.choiceDate + one
            return time.getTime() < minTime || time.getTime() > maxTime
          }
        }
      },

标签:vue,const,getTime,choiceDate,90,element,选择器
From: https://www.cnblogs.com/cloudfun/p/16965563.html

相关文章

  • vue+iview 表格行选中修改背景色
    <Table:columns="columns":no-data-text="L('NoDatas')"border:data="list":row-class-name="rowName"@on-row-click="selectChange......
  • jQuery再学习之二、jQuery选择器
    前言jQuery选择器非常非常强大而且灵活,要完全掌握它是需要狠下一番功夫的。当然,掌握了主要的部分后,其它的了解就好,因为一些比较偏的毕竟用得少,而且可以有其它方法来实现。 ......
  • Vue组件
    什么是组件组件是可复用的Vue实例,说白了就是一组可以重复使用的模板,跟JSTL的自定义标签,Thymeleaf的th:fragment等框架有着异曲同工之妙。通常一个应用会以一颗嵌套的......
  • vue上传formdata格式数据(axioes)
    vue.js上传formData数据到后台(其他js类似) 调用方式还是通过post方式请求类型要设置一下config.headers["content-type"]="multipart/form-data"; 然后上传......
  • vue3中ref和reactive的区别
    ref和reactive都是用来定义响应式数据的。ref允许我们创建一个任意类型的响应式的ref对象,在使用时需要带上.value在模板中使用ref对象时,假如ref位于顶层,就不需要使......
  • vue3 Cropperimage插件写入默认网络图片跨域解决办法----- 图片转换成base64
    最近项目中有一个裁切图片的需求,百度了一番最后选用cropperImage插件。由于项目中图片是存放在阿里云上,cropperImage插件在初始化默认图的时候会存在跨域问题,百度经验我选......
  • vue路由基础 (个人)
    首先要有一个路由的js文件import{createRouter,createWebHashHistory}from"vue-router";importappHomefrom'../views/Home.vue'importitemMusicfro......
  • Vue设计table中的身份证号加密显示
    为了保护用户隐私,需要对身份证号中间进行加密,且需要考虑末尾带有X的情况话不多少直接上代码,运用正则解决:<el-table-columnprop="idcard"label="身份证"width="180">......
  • Vue双向绑定
    什么是双向绑定数据Vue.js是一个MVVM框架,即数据双向绑定,即当数据发生变化的时候,试图也就发生变化,当试图发生变化的时候,数据也会跟着同步变化。这也算是Vue.js的精髓......
  • element-ui 表单组件的简单封装
    背景在管理系统中我们需要经常使用表单组件来收集用户的一些数据,如果按照官网的示例一个个表单项去填写不仅代码会变得很长而且麻烦,所以我们有必要去对组件进行再次的封装......