uniapp的uni-calendar日历功能改写定制指定日期禁用功能

已于 2023-04-24 16:02:41 修改
阅读量1.7k 收藏 3
点赞数 3
文章标签： 前端 javascript 前端框架 微信小程序
于 2023-03-28 17:09:57 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_77079844/article/details/129820096
版权

1.首先确定文件位置

 

2.然后进行日历的util.js改造 这边可以参考startdate和enddate的两个属性值的代码

 

 

 然后如果传了值就开始运行这个js代码 然后通过下标去进行验证 

然后通过构造方法把disableday传出去

3.回到我们的日历组件,通过父传子把disableDay传给uni-calendar

 uni-calendar通过props接收

 然后再通过uni-calendar-item父传子传给item 然后进行样式改换

 然后就实现需求啦

混入公司的小袁同学
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
uni-app-日历组件
08-12
uni-app-日历组件
【uniapp】uni-date-picker 禁用日期功能
qq_40881695的博客
05-21 5449
uni-datetime-picker 禁用日期功能
vue中日期选择器设置今天之前的日期不可选
weixin_48196628的博客
03-09 982
<el-date-picker v-model = 'time' :picker-options='pickerBeginDateBefore' @change='change' type='daterange' start-placeholder='开始日期' end-placeholder='结束日期' value-format='yyyy-MM-dd' > </el-date-picker> data(){ .
【uniapp】uni-calendar日历插件指定日期禁用不可点击
每天进步一点点, 靠近小目标一点点~
06-29 2247
日历上需要实现指定日期显示禁用状态不可点击的功能
uniapp uni-calender日历查近期还款历史 闰年平年 大小月
qq_36390107的博客
06-06 539
uniapp uni-calender日历组件 时间范围变化
uniapp mx-datepicker时间范围选择器禁用部分时间
weixin_45631278的博客
11-30 2337
需要设置当前时间以后的时间不可选中
uniapp日历uni-calendar搭配酒店入住离店时间段
GotYoung的博客
02-16 1652
uniapp使用uni-calendar 实现酒店住宿日期时间段选择
uniapp uni-calendar日期组件多选
03-07
uniapp uni-calendar日期组件多选 内附参考使用代码
uni-app 插件 Calendar 日历多选 （不是范围选择）
08-25
uni-app 插件 Calendar 日历多选 （不是范围选择）
uniapp-table中改版uni-table插件
07-03
改版uni-table插件功能，新增单击行事件、单击某td事件、单独修改某td的字体颜色；选中行样式修改。主要修改文件uni-tr、uni-td;
微信小程序uniapp日历组件
08-10
微信小程序uniapp日历组件
uni-calendar-demo.zip
09-16
自定义日历，可以添加签到标志，显示阴阳日历。点击实现上下月与上下一年
uni-app uni-data-picker 省市区数据表
06-16
<uni-data-picker> 是一个选择类datacom组件。支持多列级联选择。列数没有限制，如果屏幕显示不全，顶部tab区域会左右滚动。 适用于uni-app使用uni-data-picker实现省市区选择器的json数据
uniapp 日历组件
m0_61672533的博客
01-06 1007
uniapp 日历组件
uniapp zjy-calendar日历，uni-calendar日历增强版
y393016244的博客
07-10 2868
zjy-calendar日历是对uniapp uni-calendar日历的增强，支持圆点和文字自定义颜色。
uni-app实现可滑动日历
weixin_44659286的博客
02-28 2405
vue uni-app 滑动日历
uniapp日历插件
qingdi1的博客
04-24 2603
【代码】uniapp日历插件。
uniapp-日历控件
qq_44161703的博客
07-11 2345
chooseDay：已经选中（有标识）的日期 格式：chooseDay：['2023-02-02'] 样式也可以自己定义。actDay：鼠标点击的日期有选中的样式（可以自定义） 这个里面是 只能选中一个日期。onDayClick：有回调函数（e）e.data 就是选中的日期。第五步：修改源码中的选中和标识的样式（找到相应的位置）第二步：导入相应的项目，会有相应的提示（路径）第三步：引入对应的位置-例如我引入的位置。第一步：打开uniapp的插件市场。第四步：上面的名称解释下。
vue3.0+antdv的admin管理系统vue-admin-beautiful推荐
最新发布
独行猫a 的沉淀、积累、总结。天天学习，好好向上...c/c++,嵌入式 linux,Android,HarmonyOS)
05-15 1124
几年前，笔者自学了vue这一优秀的前端框架，但苦于没项目练手，无意间发现了这一优秀的前端集成框架。当时就使用它做了一很有意思的小项目---终端监控云平台，实现了前端和后台的整体功能。整体方案介绍参见博文《》，前端使用vue-admin-beautiful框架，后端使用go-zero微服务框架，几天内就搞出来了一个包含前端和后台的小项目。我的monitor-ui前端运行界面：后续有机会介绍下我这个终端监控云平台小项目的具体实现，挺有意思的。几年前还用到过几个地方的公交客户现场，客户挺喜欢这个功能的。
uniapp日期时间选择
04-28
UniApp是一个基于Vue.js的跨平台开发框架，可以于开发iOS、Android和Web应用程序。在UniApp中，可以使用uniatetime-picker组件来实现日期时间选择功能。 uni-datetime-picker组件是一个日期时间选择器，可以选择日期、时间或者日期时间。它提供了多种配置选项，可以根据需求进行自定义设置。以下是uni-datetime-picker组件的一些常用属性： 1. mode：选择器类型，可选值为date（日期选择器）、time（时间选择器）或datetime（日期时间选择器）。 2. start：可选的最小日期时间，格式为YYYY-MM-DD HH:mm。 3. end：可选的最大日期时间，格式为YYYY-MM-DD HH:mm。 4. value：默认选中的日期时间，格式为YYYY-MM-DD HH:mm。 5. fields：可选的精确度，可选值为year、month、day、hour、minute。 6. minute-step：分钟的步长，默认为1。 7. start-text：确认按钮的文本，默认为"确定"。 8. end-text：取消按钮的文本，默认为"取消"。 使用uni-datetime-picker组件可以方便地实现日期时间选择功能。你可以根据需要设置不同的属性来满足具体的需求。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 7
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值