可能是因为点击清空按钮后,el-date-picker组件的value值被设置为了null或undefined,而面板在显示日期之前需要一个有效的日期值来进行计算和展示。如果value值为null或undefined,面板会出现NaN(Not a Number)的情况。

解决方法是,在点击清空按钮后,设置el-date-picker的value值为一个有效的日期值,例如当前日期或一个默认的日期。这样就可以避免面板出现NaN的情况。

以下是一个示例代码:

<template>
  <el-date-picker
    v-model="date"
    type="date"
    placeholder="选择日期"
    @clear="handleClear"
  ></el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      date: null
    };
  },
  methods: {
    handleClear() {
      this.date = new Date(); // 设置为当前日期或默认日期
    }
  }
};
</script>

在上述代码中,当点击清空按钮后,会调用handleClear方法,将date的值设置为当前日期或默认日期。这样,就能避免面板出现NaN的情况。

elementplus el-date-picker 点击清空按钮后 面板出现NAN

原文地址: https://www.cveoy.top/t/topic/i9hw 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录