【Cron表达式】基于Vue2及Element的Cron时间表达式生成器

简介: 首先感谢两位开源作者的奉献(ldang264),(1615450788)以下代码功能项,全部基于这两个开源库所做的合集。并增加了部分功能项,删减了中英切换等

首先感谢两位开源作者的奉献(ldang264)(1615450788)以下代码功能项,全部基于这两个开源库所做的合集。并增加了部分功能项,删减了中英切换等

组件git地址 (Cron-component ) 。 直接下载拖到项目里。没打成npm包

特性

  • 🎉 全面支持cron:秒、分、时、日、月、周、年
  • 🎉 日及周条件互斥,自动改变响应值
  • 🎉 支持反解析cron表达式到UI
  • 🎉 可结合此组件与Antd的下拉及输入组件封装成下拉输入框

1.png

2.png

CRON 表达式是一个字符串,以 5 或 6 个空格隔开,分为 6 或 7 个域,每一个域代表一个含义。

CRON 有如下两种语法格式:

  • 秒 分 小时 日期 月份 星期 年
  • 秒 分 小时 日期 月份 星期

每个域允许的值

允许的数值 允许的特殊字符 备注
0~59 - * / -
0~59 - * / -
小时 0~23 - * / -
日期 1~31 - * ? / L W C -
月份 1~12 JAN-DEC - * / -
星期 1~7 SUN-SAT - * ? / L C # 1 表示星期天,2 表示星期一,依次类推
年(可选) 留空,1970~2099 , - * / 自动生成,工具不显示该值

示例

  • */5 * * * * ?:每隔 5 秒执行一次
  • 0 */1 * * * ?:每隔 1 分钟执行一次
  • 0 0 2 1 * ? *:每月 1 日的凌晨 2 点执行一次
  • 0 15 10 ? * MON-FRI:周一到周五每天上午 10:15 执行作业
  • 0 15 10 ? 6L 2002-2006:2002 年至 2006 年的每个月的最后一个星期五上午 10:15 执行作业
  • 0 0 23 * * ?:每天 23 点执行一次
  • 0 0 1 * * ?:每天凌晨 1 点执行一次
  • 0 0 1 1 * ?:每月 1 日凌晨 1 点执行一次
  • 0 0 23 L * ?:每月最后一天 23 点执行一次
  • 0 0 1 ? * L:每周星期天凌晨 1 点执行一次
  • 0 26,29,33 * * * ?:在 26 分、29 分、33 分执行一次
  • 0 0 0,13,18,21 * * ?:每天的 0 点、13 点、18 点、21 点都执行一次
  • 0 0 10,14,16 * * ?:每天上午 10 点,下午 2 点,4 点执行一次
  • 0 0/30 9-17 * * ?:朝九晚五工作时间内每半小时执行一次
  • 0 0 12 ? * WED:每个星期三中午 12 点执行一次
  • 0 0 12 * * ?:每天中午 12 点触发
  • 0 15 10 ? * *:每天上午 10:15 触发

内容同步更新到我的技术文档笔记

相关文章
|
10月前
|
JavaScript 前端开发 安全
【vue】如何修改iview组件的样式(element同)
【vue】如何修改iview组件的样式(element同)
126 1
|
6月前
|
JavaScript
Vue使用element中table组件实现单选一行
如何在Vue中使用Element UI的table组件实现单选一行的功能。
340 5
Vue使用element中table组件实现单选一行
|
5月前
|
资源调度 JavaScript PHP
Vue3+ element plus 前后分离admin项目安装教程
Vue3+ element plus 前后分离admin项目安装教程
133 0
|
7月前
|
JavaScript
Element - Vue使用slot-scope和v-for遍历数据为树形表格
这篇文章介绍了在Vue中使用`slot-scope`和`v-for`指令来遍历数据并将其渲染为树形表格的方法。
94 0
Element - Vue使用slot-scope和v-for遍历数据为树形表格
|
7月前
|
开发者 C# Android开发
明白吗?Xamarin与Native的终极对决:究竟哪种开发方式更适合您的项目需求,让我们一探究竟!
【8月更文挑战第31天】随着移动应用开发的普及,开发者面临多种技术选择。本文对比了跨平台解决方案Xamarin与原生开发方式的优势与劣势。Xamarin使用C#进行跨平台开发,代码复用率高,可大幅降低开发成本;但因基于抽象层,可能影响性能。原生开发则充分利用平台特性,提供最佳用户体验,但需维护多套代码库,增加工作量。开发者应根据项目需求、团队技能和预算综合考量,选择最适合的开发方式。
154 0
|
7月前
|
JavaScript 前端开发 开发者
决战前端之巅!Element UI与Vuetify谁才是Vue.js组件界的霸主?一场关于颜值与实力的较量!
【8月更文挑战第30天】本文对比了两款热门的Vue.js组件库——Element UI与Vuetify。Element UI由饿了么团队打造,提供多种高质量UI组件,设计简洁大方。Vuetify基于Material Design规范,支持Vue.js 2.0及3.0版本,具备前瞻性。两者均涵盖表单、导航、数据展示等组件,Element UI配置选项丰富,而Vuetify则提供了更深层的样式定制功能。开发者可根据项目需求及个人偏好选择合适的组件库。
514 0
|
7月前
|
JavaScript 开发者 UED
Vue.js组件库大对决:Element UI与Vuetify,开发者的罗密欧与朱丽叶!
【8月更文挑战第30天】Element UI和Vuetify是Vue.js开发中的热门组件库,前者简洁高效,后者遵循Material Design,国际化程度高。两者均提供丰富的组件支持,但Vuetify组件更多样,设计更灵活;Element UI在性能和中文支持上更优。文档方面,Element UI更直观易懂,而Vuetify配置灵活但学习成本稍高。选择时需综合考虑项目需求、团队背景及设计风格,以达到最佳开发效果。
373 0
|
8月前
|
存储 开发框架 前端开发
Vue&Element开发框架中增加工作流处理,工作流的各个管理页面的界面处理
Vue&Element开发框架中增加工作流处理,工作流的各个管理页面的界面处理
|
8月前
|
开发框架 JavaScript 前端开发
Vue&Element开发框架中增加工作流处理,查看申请单中整合多个处理类型的处理
Vue&Element开发框架中增加工作流处理,查看申请单中整合多个处理类型的处理
|
8月前
|
开发框架 监控 前端开发
自定义Vue&Element组件,实现用户选择和显示
自定义Vue&Element组件,实现用户选择和显示

热门文章

最新文章