vue控制element-ui的时间选择控件之内显示特定区间的值

效果

只能显示当前天之后的日期，，或者获取到另一个时间，只能选择这个特定时间之后的日期的方法

1只能选择当前天之后的日期：

控件代码：

<el-table-column label="预计归还时间" prop="jjLoaghdate" width="240">
  <template slot-scope="scope">
    <el-form-item :prop="`dhcLoanListList.${scope.$index}.jjLoaghdate`" labelWidth="0px">
      <el-date-picker clearable v-model="scope.row.jjLoaghdate" type="date" value-format="yyyy-MM-dd"
                      placeholder="请选择预计归还时间" :picker-options="pickOptions"
                      :readonly="form.loanSavecommit==2"/>
    </el-form-item>
  </template>
</el-table-column>

在data的return下定义：

pickOptions: {
  disabledDate(time) {
    return time.getTime() < Date.now() - 8.64e7;
  }
},

完成：

2，选择特定某一个时间之后的日期：

<el-table-column label="延期时间" prop="delayDate">
  <!--&lt;!&ndash;            :prop="`dhcLoanListList.${scope.$index}.remark`"&ndash;&gt;prop="delayDate"   :rules="rules.delayDate"-->
  <template slot-scope="scope">
    <el-form-item :prop="`deviceDelayReturnDetailList.${scope.$index}.delayDate`" :rules="rules.delayDate"
                  labelWidth="0px">
      <el-date-picker clearable v-model="scope.row.delayDate" :picker-options="scope.row.delayDatefw" type="date" value-format="yyyy-MM-dd"
                      placeholder="请选择延期时间" @change="changeDelyDate(scope.row,scope.$index)"/>
    </el-form-item>
  </template>
</el-table-column>

scope.row.delayDatefw是随便定义的虚拟字段

页面加载时的方法里，

list001.delayDatefw = {
  disabledDate :(time)=>{
    return time.getTime() < new Date(list001.returnNdate).setHours(0,0,0,0);
  }
}

list001是定义的页面显示数组

list001.returnNdate是我们需要在这个时间之后

delayDatefw是我们之前定义的虚拟字段