有什么方法解决时间日期选择器不选择日期和时间的时候,确定按钮处于禁止状态?

我需要的是,我点击时间,确定按钮处于禁止状态,只有选择了才能点击确定

你用的哪个时间日历组件。。。。。还是说本来就是你自己写的?

如果有这个时间选择器的源码,修改源码就很简单

就是element官方的时间日期选择器

你这个需求,,,这个组件默认是选择了当前日期的,所以确定按钮是一直可以点击的。如果想要达到你的需求的话,需要研究element的源码了,要把当前日期的默认选择去掉。。。

二楼大佬有办法吗

你先利用/deep/让他默认禁用 再监听选择框的值只要不为空 就获取确认按钮元素,改变它的style 获取方法是document.querySelector(".el-picker-panel__footer").childNodes[1]

三楼大佬可以帮忙写个小demo吗,刚开始学这个,不太懂o^o

<!--
 * @Author: G_yl
 * @Date: 2020-12-30 10:30:35
 * @LastEditTime: 2020-12-30 10:30:35
-->
<template>
  <el-date-picker
  class="my-picker"
    v-model="dateTimeValue"
    @change="pickerChange"
    type="datetimerange"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    align="left"
  ></el-date-picker>
</template>
<script>
export default {
  data() {
    return {
      dateTimeValue: ""
    };
  },
  methods: {
      pickerChange(){
          if (dateTimeValue!="") {
              let dom = document.querySelector(".el-picker-panel__footer").childNodes[1].style
              dom.background = "blue"
              dom.pointerEvents=""
          }
      }
  }
};
</script>
<style lang="less" scoped>
.my-picker{
    /deep/.is-disabled{
        background: gray;
        color: #ffffffad;
    }
}
</style>

伪代码 没测试过

忘记加pointer-events: none; 要使用要在css里面加上

感谢大佬