微信小程序中应用van-calendar时加载时间过长,以及设置min-data无效的问题解决

一、我们微信小程序中应用van-calendar时,如果没有设置min-data,那么页面的加载时间会非常长,所以,一定一定要配置min-data

二、vue中min-data的写法是:min-data="new Date(2023, 0, 1)",而在小程序中的写法则是min-data="{{ minData }}",minData的值为:new Date(2023, 0, 1).getTime()。

注意:

1、minData的值只能在js文件中设置,不能直接写进页面里边,因为页面中不能识别 new Date(),会报错;
2、一定要加上.getTime(),不然也无法生效;

html 复制代码
错误一:
<van-calendar
  class="van-calendar"
  show="{{dataPickVisble}}"
  :min-date="minDate"
  bind:confirm="confirmDate"
  bind:close="closeDatePopup"
/>

错误二:
<van-calendar
  class="van-calendar"
  show="{{dataPickVisble}}"
  :min-date="{{ new Date(2023, 0, 1) }}"
  bind:confirm="confirmDate"
  bind:close="closeDatePopup"
/>

错误三:
<van-calendar
  class="van-calendar"
  show="{{dataPickVisble}}"
  :min-date="{{ minDate }}"
  bind:confirm="confirmDate"
  bind:close="closeDatePopup"
/>
javascript 复制代码
data: {
	minDate: new Date(2023, 0, 1)
}

正确写法:

html 复制代码
<van-calendar
  class="van-calendar"
  show="{{dataPickVisble}}"
  :min-date="{{ minDate }}"
  bind:confirm="confirmDate"
  bind:close="closeDatePopup"
/>
javascript 复制代码
data: {
	minDate: new Date(2023, 0, 1).getTime()
}
相关推荐
毕设源码-赖学姐1 天前
【开题答辩全过程】以 “饭否”食材搭配指南小程序的设计与实现为例,包含答辩的问题和答案
小程序
nodcloud1 天前
点可云进销存商城如何部署在微信小程序
微信小程序·小程序
老华带你飞2 天前
畅阅读小程序|畅阅读系统|基于java的畅阅读系统小程序设计与实现(源码+数据库+文档)
java·数据库·vue.js·spring boot·小程序·毕设·畅阅读系统小程序
老华带你飞2 天前
租房平台|租房管理平台小程序系统|基于java的租房系统 设计与实现(源码+数据库+文档)
java·数据库·小程序·vue·论文·毕设·租房系统管理平台
项目題供诗2 天前
微信小程序开发教程(八)
微信小程序·小程序
00后程序员张2 天前
iOS App 混淆与资源保护:iOS配置文件加密、ipa文件安全、代码与多媒体资源防护全流程指南
android·安全·ios·小程序·uni-app·cocoa·iphone
低代码布道师2 天前
少儿舞蹈小程序(12)作品列表查询搭建
低代码·小程序
编程迪2 天前
基于Java+Vue开发的家政服务系统源码适配H5小程序APP
小程序·家政小程序·家政系统源码·家政系统·家政源码
拼图2092 天前
微信小程序——云函数【使用使用注意事项】
微信小程序·小程序
fakaifa2 天前
【独立版】智创云享知识付费小程序 v5.0.23+小程序 搭建教程
小程序·uni-app·知识付费·源码下载·智创云享独立版