elementUi中el-date-picker;两个日期选择器第二个必须在第一个之后

html 复制代码
<el-row>
 <el-col :span="12">
   <el-form-item label="实际开始日期" style="margin-top: 10px;" prop='realBeginDate'>
      <el-date-picker v-model="pmTaskProgressFeedback.realBeginDate" type="date" placeholder="请选择实际开始日期":disabled="pmTaskProgressFeedback.progress == 0" value-format="yyyy-MM-dd" ></el-date-picker>
     </el-form-item>
 </el-col>
  <el-col :span="12" v-if="pmTaskProgressFeedback.progress == 100">
        <el-form-item label="实际结束日期" style="margin-top: 10px;" prop='realEndDate'>
             <el-date-picker v-model="pmTaskProgressFeedback.realEndDate" type="date" placeholder="请选择实际结束日期" :disabled="pmTaskProgressFeedback.progress == 0" value-format="yyyy-MM-dd" :picker-options='realEndTimeOptions'></el-date-picker>
          </el-form-item>
    </el-col>
 </el-row>

使用picker-options来进行限定,这里需要的是picker-options绑定的值最好在computed中进行,因为网上资料让在data中定义,但是,data函数中无法拿到表单的值,会报错,所以解决办法是在computed中定义

javascript 复制代码
 computed:{
        // 实际结束日期必须选择实际结束日期之后
       realEndTimeOptions:vm =>{
        return{
            disabledDate:time=>{
                let beginDateVal = `${vm.pmTaskProgressFeedback.realBeginDate}`;
                if (beginDateVal) {
                    return (
                    time.getTime() <
                    new Date(beginDateVal).getTime() + 1 * 24 * 60 * 60 * 1000 - 16.64e7
                    );
                }else {
                    return time.getTime() < Date.now() - 8.64e7;
                }
            }
        }
     }
    },
相关推荐
Dread_lxy1 小时前
vue 依赖注入(Provide、Inject )和混入(mixins)
前端·javascript·vue.js
奔跑草-2 小时前
【前端】深入浅出 - TypeScript 的详细讲解
前端·javascript·react.js·typescript
羡与2 小时前
echarts-gl 3D柱状图配置
前端·javascript·echarts
前端郭德纲2 小时前
浏览器是加载ES6模块的?
javascript·算法
JerryXZR2 小时前
JavaScript核心编程 - 原型链 作用域 与 执行上下文
开发语言·javascript·原型模式
帅帅哥的兜兜2 小时前
CSS:导航栏三角箭头
javascript·css3
渗透测试老鸟-九青3 小时前
通过投毒Bingbot索引挖掘必应中的存储型XSS
服务器·前端·javascript·安全·web安全·缓存·xss
龙猫蓝图3 小时前
vue el-date-picker 日期选择器禁用失效问题
前端·javascript·vue.js
夜色呦3 小时前
掌握ECMAScript模块化:构建高效JavaScript应用
前端·javascript·ecmascript
peachSoda73 小时前
随手记:简单实现纯前端文件导出(XLSX)
前端·javascript·vue.js