laydate 初始化时value必须显式传new Date(),否则输入框为空;需确保type、format、value三者严格匹配,range模式下value须为合法分隔字符串,时区差异需在提交前手动处理。

laydate 初始化时 value 必须显式传 new Date()
不设 value,哪怕面板里“今天”被高亮,输入框也一定是空的——这是最常被误以为“已生效”的坑。laydate 不会把面板默认高亮同步到输入框值,它只认你传的 value 参数。
正确写法是直接传 new Date():
laydate.render({<br> elem: '#test',<br> format: 'yyyy-MM-dd',<br> value: new Date() // ✅ 每次渲染都取当前日期,自动适配本地时区<br>});
-
value支持字符串或Date对象,但传Date对象最稳妥:避免硬编码过期(如'2026-10-02')、避开字符串解析兼容性问题(尤其 IE8–10) - 如果
format含时间(如'yyyy-MM-dd HH:mm:ss'),且type: 'datetime',new Date()会带实时秒级时间;若只要日期,用type: 'date',它会自动截断时分秒 - 别手动拼字符串:
new Date().getFullYear() + '-' + ...容易漏补零、错月份(getMonth()从 0 开始),不必要地增加出错点
为什么设了 value: new Date() 还不显示?重点查 format 和 type 匹配
laydate 对 value 的解析非常严格,不自动容错。常见失效原因不是插件坏了,而是三者没闭环对齐:type、format、value 类型。
-
type: 'date'但format: 'yyyy-MM-dd HH:mm:ss'→ 时间部分被静默丢弃,可能显示为空 -
type: 'datetime'却只传value: '2026-10-02'(缺时分秒)→ 解析失败,输入框为空 - 验证是否匹配:在控制台执行
laydate.now(0, 'yyyy-MM-dd HH:mm:ss'),看返回格式是否和你的format完全一致
真正安全的做法是让 type 和 format 语义一致:
要纯日期 → type: 'date' + format: 'yyyy-MM-dd'
要带时间 → type: 'datetime' + format: 'yyyy-MM-dd HH:mm:ss'
range 模式下想默认选中“今天一整天”,分隔符和时间必须合法
range 模式不能只靠 value: new Date(),它需要两个时间点组成的字符串,且格式极敏感。
- 分隔符必须是
' - '(英文空格 + 短横 + 英文空格),不是'-'、'–'或'至' - 两端时间都得合法,且格式与
format严格一致。例如format: 'yyyy-MM-dd HH:mm:ss',则value必须是'2026-10-02 00:00:00 - 2026-10-02 23:59:59' - 推荐构造方式(避免手算):
const now = new Date();<br>const start = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);<br>const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);<br>const valueStr = laydate.now(0, 'yyyy-MM-dd HH:mm:ss') + ' - ' + laydate.now(24 * 60 * 60 - 1, 'yyyy-MM-dd HH:mm:ss');
时区和后端时间戳对不上?别只调前端 value
前端 new Date() 拿的是用户本地时间,而多数后端存的是 UTC 或固定时区(如东八区)时间戳。这个差异不会在 laydate 显示层暴露,但提交后可能发现“今天”变成昨天或明天。
真正容易被忽略的是:laydate 的 value 只管显示,不管传输。如果你的接口要求时间戳必须是 UTC,就得在提交前手动转换,比如:Math.floor(new Date().getTime() / 1000) 是本地时间戳,Math.floor(new Date().getTime() / 1000) - (new Date().getTimezoneOffset() * 60) 才接近 UTC 秒数。











