vue表单验证cron表达式

╰+攻爆jí腚メ 2023-06-18 15:54 3阅读 0赞

验证是否为正规的corn表达式，

<el-form-item label="corn表达式:" :label-width="formLabelWidth" prop="cronExpression">
                  <el-input class="col-sm-10" v-model="qualityTaskManageForm.cronExpression"
                            placeholder="请输入corn表达式"></el-input>
                </el-form-item>
    //统一写在form定义好的rules中；prop对应rules中的名称；
    rules: {
      cronExpression:[
    {required:true,validator:handleCronValidate,trigger: 'blur'},
        ]
    }
    //定义一个handleCronValidate验证方法 直接在data中，与return平级
    data() {
    //校验是否为cron表达式
        var handleCronValidate=(rule,value,callback)=>{
      if(!!value){
        let parser=require('cron-parser');
        try{
          let interval=parser.parseExpression(value);
          console.log("cronDate:",interval.next().toDate());
        } catch (e) {
          callback("非Cron表达式格式，请检查！"+e.message);
        }
      } else {
        callback("Cron表达式不能为空！");
      }
      callback();
    };
    }

### ！！！使用前提： ###

得去cron-parser的官文 [https://www.npmjs.com/package/cron-parser][https_www.npmjs.com_package_cron-parser] 安装该cron解析器才能正常通过cron-parser去转换，如下安装命令即可；

npm i cron-parser

安装完重新 npm install ；

定义验证规则方式多样，如有不详，可参考这篇：[https://blog.csdn.net/weixin\_43970743/article/details/102500272][https_blog.csdn.net_weixin_43970743_article_details_102500272]

[https_www.npmjs.com_package_cron-parser]: https://www.npmjs.com/package/cron-parser
[https_blog.csdn.net_weixin_43970743_article_details_102500272]: https://blog.csdn.net/weixin_43970743/article/details/102500272