el-date-picker 默认展示当前日期

el-date-picker 默认展示当前日期

1、第一步：html中展示 el-date-picker绑定的值为 v-model=“form.checkInTime”

           <el-date-picker
              clearable
              size="small"
              v-model="form.checkInTime"
              type="date"
              value-format="yyyy-MM-dd"
              :placeholder="$t('punchCard.please_select_punchCardDate')"
              :picker-options="pickerOptions"
            >
            </el-date-picker>

2、第二步：封装一个函数getDate()

getDate() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      var hour = " 00:00:00"; //默认时分秒 如果传给后台的格式为年月日时分秒，就需要加这个，如若不需要，此行可忽略
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;//
      return defaultDate;
    },

3、第三步：在界面刚开始的时候直接把html中绑定的值this.form.checkInTime直接付给这个函数
我这边是打开一个dialog，所以在打开的时候赋值 this.form.checkInTime = this.getDate();

/** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.activePanel = "first";
      this.form.checkInTime = this.getDate();
      this.open = true;
      this.title = this.$t("punchCard.startPunchCard");
    },