相信很多网友现在都在用element-ui这个vue的ui框架,表单中几乎都会用到日期选择器这个控件,会遇到一种情况是只能选择后面的日期或是只能选择之前的日期,这时候你会发现element-ui的官方文档已经满足不了你了。这时候你就需要另辟新径。

经过多方的探寻与验证,总结出了以下的方法:

代码

<el-date-picker
  v-model="ruleForm.established"
  type="year"
  :picker-options="setYearDisabled"
  value-format="yyyy"
  placeholder="选择成立时间">
</el-date-picker>
setYearDisabled: {
   // const year = date.getFullYear(); // 获取当前年份,值是这样的: 2021
   disabledDate(time) {
  return time.getTime() >= (Date.now()-8.64e7)
  }
},

time.getTime() < Date.now() - 8.64e7 代表着可以选今天之后的日期

time.getTime() > Date.now() - 8.64e7 代表着可以选今天之前的日期

这个方法对于你显示的格式是否是年月日都不影响

Logo

前往低代码交流专区

更多推荐