【element-ui】el-date-picker动态设置picker-options

复制代码
<el-date-picker
  v-model="formObj.startDate"
  type="date"
  placeholder="开始时间"
  :picker-options="startPickerOptions">
</el-date-picker>

<el-date-picker
  v-model="formObj.endDate"
  type="date"
  placeholder="结束时间"
  :picker-options="endPickerOptions">
  </el-date-picker>

computed:{
    startPickerOption(){
        let _this = this
        return {
            disabledDate(time){
                if(_this.formObj.endDate){
                    return time.getTime() > new Date(_this.formObj.endDate).getTime()
                }else{
                    return false
                }
            }
        }
    },
    endPickerOption(){
        let _this = this
        return {
            disabledDate(time){
                if(_this.formObj.startDate){
                    return time.getTime() > new Date(_this.formObj.startDate).getTime()
                }else{
                    return false
                }
            }
        }
    },
}

效果图如下:

相关推荐
徐小夕1 天前
我用 AI 撸了个开源"万能预览器":浏览器直接打开 Office、CAD 和 3D 模型
前端·vue.js·github
前端Hardy1 天前
字节/腾讯内部流出!Claude Code 2026王炸玩法!效率暴涨10倍
前端·javascript·vue.js
FlDmr4i281 天前
使用Gemini3+ui-ux-pro-max skill开发款查询本地ip插件
tcp/ip·ui·ux
逆光如雪1 天前
移动端卡片边框怎么做高级?我用 CSS 实现了设计师的刁钻要求
前端·css·vue.js
莹宝思密达1 天前
地图显示西安经济开发区边界线-2023.12
前端·vue.js·数据可视化
宇擎智脑科技1 天前
Claude Code 源码分析(七):终端 UI 工程 —— 用 React Ink 构建工业级命令行界面
前端·人工智能·react.js·ui·claude code
leafyyuki1 天前
告别 Vuex 的繁琐!Pinia 如何以更优雅的方式重塑 Vue 状态管理
前端·javascript·vue.js
秋雨梧桐叶落莳1 天前
iOS——UI入门
ui·ios·cocoa
Hooray1 天前
AI 时代的管理后台框架,应该是什么样子?
前端·vue.js·ai编程
星辰即远方1 天前
UI学习入门
学习·ui