el-input单独校验

el-input单独校验,效果图如下

          <el-col :span="24">
            <el-form-item label="修订次数:" prop="sPublish">
              <el-input-number
                v-model="addForm.sPublish"
                :min="0"
                :controls="false"
                :precision="0"
                placeholder="请输入"
                @change="changesPublish"
                style="width: 80px"
                size="small"
              />
              -
              <el-input-number
                v-model="addForm.ePublish"
                :min="0"
                :controls="false"
                :precision="0"
                placeholder="请输入"
                style="width: 80px"
                size="small"
                @change="changesPublish"
              />
            </el-form-item>
          </el-col>

data中定义校验规则

    saerchFormRules: {
        sPublish: [{ validator: this.validatePass, trigger: "blur" }],
      },

methods中使用

 // 查询修订次数
    changesPublish(val) {
      this.$refs.addForm.validateField("sPublish");
    },

    validatePass(rule, value, callback) {
      if (this.addForm.sPublish > this.addForm.ePublish) {
        return callback(new Error("前数不能小于后数"));
      }
    },
相关推荐
林涧泣12 分钟前
【Uniapp-Vue3】StorageSync数据缓存API
前端·javascript·uni-app
—丫丫1 小时前
uniapp商城项目之商品详情
java·javascript·uni-app
康王有点困2 小时前
Vue入门(Vue基本语法、axios、组件、事件分发)
前端·javascript·vue.js
zhouzhurong2 小时前
基于vue和elementui的简易课表
前端·vue.js·elementui·课程表·课表
夏天想2 小时前
element-plus 的table section如何实现单选
前端·javascript·vue.js
傻小胖2 小时前
Vue3 provide/inject用法总结
前端·javascript·vue.js
老大白菜2 小时前
Egg.js GraphQL 完整指南
开发语言·javascript·graphql
myzzb2 小时前
GPT 本地运行输出界面简洁美观(命令行、界面、网页)
前端·图像处理·人工智能·python·gpt·深度学习
Swift社区4 小时前
LeetCode - #195 Swift 实现打印文件中的第十行
vue.js·leetcode·swift
微臣愚钝9 小时前
前端【8】HTML+CSS+javascript实战项目----实现一个简单的待办事项列表 (To-Do List)
前端·javascript·css·html