关于时间框 date.getHours is not a function 报错问题解决

1.可以发现,页面上选择的只有日期,但是代码中却有 HH:mm:ss

value-format="yyyy-MM-dd HH:mm:ss"

2.而且代码中

type="date"

3.date.getHours is not a function应该与此有关

解决方案:

删除HH:mm:ss

经验证,可以正常的选择日期了。

.

拓展:

 如果想要 type="date" 页面上只展示日期 ,而向后端发送的时候是 yyyy-MM-dd HH:mm:ss 这种格式的话

 <el-date-picker
      :disabled="disabledFields.includes('battery_factory_date') && isRequired"
      class="common-datetime-picker no-close"
      popper-class="common-datetime-picker-select"
      type="date"
      placeholder="请选择"
      v-model="form.battery_factory_date"
      :picker-options="setDisabled"
      @change="getdatatime()"
  />

需要引入:

import { parseTime} from "@/utils/index";

utils/index文件

/**
 * Parse the time to string
 * @param {(Object|string|number)} time
 * @param {string} cFormat
 * @returns {string | null}
 */
export function parseTime(time, cFormat) {
  if (arguments.length === 0 || !time) {
    return null
  }
  const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
  let date
  if (typeof time === 'object') {
    date = time
  } else {
    if ((typeof time === 'string')) {
      if ((/^[0-9]+$/.test(time))) {
        // support "1548221490638"
        time = parseInt(time)
      } else {
        // support safari
        // https://stackoverflow.com/questions/4310953/invalid-date-in-safari
        time = time.replace(new RegExp(/-/gm), '/')
      }
    }

    if ((typeof time === 'number') && (time.toString().length === 10)) {
      time = time * 1000
    }
    date = new Date(time)
  }
  const formatObj = {
    y: date.getFullYear(),
    m: date.getMonth() + 1,
    d: date.getDate(),
    h: date.getHours(),
    i: date.getMinutes(),
    s: date.getSeconds(),
    a: date.getDay()
  }
  const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
    const value = formatObj[key]
    // Note: getDay() returns 0 on Sunday
    if (key === 'a') {
      return ['日', '一', '二', '三', '四', '五', '六'][value]
    }
    return value.toString().padStart(2, '0')
  })
  return time_str
}

methods 中 :

   getdatatime(value) {   
      if (value == '') {
        this.form.battery_factory_date= "";
      } else {
        this.form.battery_factory_date =
          parseTime(this.form.battery_factory_date, "{y}-{m}-{d}") + " 00:00:00";
      }    
    },

``` Page({ data: { boli1_imageUrl: '', boli2_imageUrl: '', boli3_imageUrl: '' }, // 通用拍照方法 takePhoto(type) { const watermarkTexts = { boli1: '剥离前照片', boli2: '实施现场照片', boli3: '竣工验收现场照片' }; wx.chooseImage({ count: 1, success: res => { const tempFile = res.tempFilePaths[0]; const key = `${type}_imageUrl`; const canvasId = `watermarkCanvas_${type}`; this.setData({ [key]: tempFile }, () => { this.addWatermark(canvasId, watermarkTexts[type]); }); } }); }, // 绑定拍照事件 takePhotoBoli1() { this.takePhoto('boli1'); }, takePhotoBoli2() { this.takePhoto('boli2'); }, takePhotoBoli3() { this.takePhoto('boli3'); }, // 添加水印方法 addWatermark(canvasId, text) { const ctx = wx.createCanvasContext(canvasId); const date = new Date(); const timestamp = `${date.getFullYear()}-${(date.getMonth()+1).toString().padStart(2,'0')}-${date.getDate().toString().padStart(2,'0')} ${date.getHours().toString().padStart(2,'0')}:${date.getMinutes().toString().padStart(2,'0')}`; // 设置水印样式 ctx.setFontSize(14); ctx.setFillStyle('rgba(255, 0, 0, 0.6)'); ctx.setTextBaseline('top'); // 计算文字位置(右下角显示) const textWidth = ctx.measureText(text).width; const timeWidth = ctx.measureText(timestamp).width; const maxWidth = Math.max(textWidth, timeWidth); // 绘制背景 ctx.setFillStyle('rgba(255, 255, 255, 0.3)'); ctx.fillRect(280 - maxWidth - 5, 360 - 40, maxWidth + 10, 35); // 绘制文字 ctx.setFillStyle('red'); ctx.fillText(text, 280 - textWidth - 5, 360 - 35); ctx.fillText(timestamp, 280 - timeWidth - 5, 360 - 20); ctx.draw(); } });```调试报错TypeError: Cannot read property 'toString' of undefined
最新发布
03-25
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值