最近做的一个vue3项目过程中,需要用到cron表达式功能,而对于普通业务人员,他们是不懂cron表达式规则的,所以需要做一个可手动配置生成cron表达式的功能。从网上查找了一些相关资料,然后结合vue3+Element Plus,改造成适合自己项目的组件。记录代码如下: 实现功能: 1、在下拉框里手动选择后生成cron表达式 2、根据cron表达式,
/** 确定访问子组件方法*/functionformCrontSubmit(){ proxy.$refs.crontabRef.submitFill(); }/** 重置访问子组件方法*/functionformCrontReset(){ proxy.$refs.crontabRef.clearCron(); }/** 子组件确认回调方法*/functioncrontabFill(value) { formData.value.cronExpression=value; }...
在Vue 3中,可以使用第三方库或自己编写组件来实现cron表达式的生成和管理。以下是一些关于Vue 3中cron组件的信息和示例代码: 1. 使用第三方库 有一些现成的Vue 3组件库提供了cron表达式的生成和管理功能,例如cron-editor-vue3。你可以通过npm安装这些库,并在你的Vue项目中使用它们。 安装 bash npm i cron-editor...
Vue3项目实现可配置生成cron表达式组件,结合vue3+Element Plus改造。组件有秒、分、时、天、月、年选项卡,可手动配置各时间单位规则,还介绍cron表达式语法及常用例子。
no-vue3-cron仓库地址:https://github.com/wuchuanpeng/no-vue3-cron vue-cron.vue 代码语言:javascript 代码运行次数:0 运行 AI代码解释 .no-vue3-cron-div { .language { position: absolute; right: 25px; z-index: 1; } .el-tabs { box-shadow: none; } .tabBody { overflow: auto; .el-r...
cron:{ type:Object, default:function(){ return{} } }, }); constradioValue=ref(1); constcycle01=ref(1); constcycle02=ref(2); constaverage01=ref(0); constaverage02=ref(1); constcheckboxList=ref([]); //计算两个周期值 constcycleTotal=computed(()=>{ ...
局部引入 在使用的组件的vue文件中直接引入 import'vue3-cron-plus-picker/style.css'import{Vue3CronPlusPicker}from'vue3-cron-plus-picker' 3 使用 <template><el-inputclass="elInput"v-model="cronValue"placeholder="请输入正确的cron表达式"><template#append><el-buttonclass="inputButton"@click="openD...
介绍 这是一个cron表达式生成插件,基于vue3.0实现 项目启动 1.yarn install 2.yarn dev 软件架构 1、组件基于 Vue3 2、无任何ui依赖,基于Vue3项目的都可用 组件预览 感谢 此代码基于sugdove大佬修改https://github.com/sugdove/vue3-cron
vue3 Ant Design Vue cron转换器 在Vue项目中使用vue自带的过度组件transition. Vue 提供了 transition 的封装组件,在下列情形中,可以给任何元素和组件添加进入/离开过渡 使用需求: 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 组件根节点
no-vue3-cron仓库地址:https://github.com/wuchuanpeng/no-vue3-cron vue-cron.vue .no-vue3-cron-div { .language { position: absolute; right: 25px; z-index: 1; } .el-tabs { box-shadow: none; } .tabBody { overflow: auto; .el-row { margin: 20px0; .long{ .el-select { width...