elementui表單驗證 對比兩個表單大小
接到需求:將輸入的血壓最大值最小值進行對比,最大值不得小於最小值。
解決方法:使用表單驗證,自己寫個函式,注意,一定要轉化成number型別,不然會出現問題。
程式碼:
data() {
let low = (rule,value,callback) => {
// if(!value) {
// return new Error('必填資訊')
// }else {
if(Number.isInteger(value)) {
callback(new Error('請輸入數字值'))
}else{
if(value < 0) {
callback(new Error('不能小於0'))
}else if(value < 70){
callback(new Error('不能小於70'))
}else if(Number(value) >Number(this.dataForm.high) ){
callback(new Error('不能大於高壓值'))
}else {
callback()
}
}
}
// }
let high = (rule,value,callback) => {
// if(!value) {
// return new Error('必填資訊')
// }else {
if(Number.isInteger(value)) {
callback(new Error('請輸入數字值'))
}else{
if(value < 0) {
callback(new Error('不能小於0'))
}else if(value > 160){
callback(new Error('不能大於160'))
}else if(Number(value) < Number(this.dataForm.low)){
callback(new Error('不能小於低壓值'))
console.log(this.dataForm.low + '------' + this.dataForm.high);
}else {
callback()
}
}
}
// }
dataRule: {
lineName: [
{ required: true, message: "線路不能為空", trigger: "blur" },
],
low:[{validator:low,trigger:'blur'}],
high:[{validator:high,trigger:'blur'}],
},
相關文章
- 實現elementUI表單的全域性驗證UI
- JavaScript 表單驗證JavaScript
- Laravel 表單驗證Laravel
- javascript表單驗證JavaScript
- bootstrap表單驗證boot
- bootstrapValidator 表單驗證boot
- antd 表單驗證
- vue+elementUI 複雜表單的驗證、資料提交方案VueUI
- 輸入表單驗證
- 路由表單驗證路由
- 表單required 必需驗證UI
- HTML 表單驗證概述HTML
- 表單資料驗證
- 表單驗證 regex:pattern
- vue elementUI 表單校驗(多層巢狀)VueUI巢狀
- vue+elementUI實現動態增加表單項並新增驗證VueUI
- vue表單驗證你真的會了嗎?元件之表單驗證(form)validateVue元件ORM
- Lumen 仿 Laravel 表單驗證Laravel
- 表單驗證工具類ValidationUtils
- Layui 自定義表單驗證UI
- jquery.validate 表單驗證jQuery
- 前端表單驗證的目的前端
- 表單驗證教程簡介
- validate表單驗證外掛
- 用onsubmit做簡單表單驗證(37)MIT
- elementUI 不用在寫rule來作表單校驗啦UI
- iview表單驗證問題 Select驗證必填失敗,以及表單物件巢狀陣列驗證方法View物件巢狀陣列
- 實戰表單驗證學習
- BootstrapBlazor-ValidateForm 表單驗證元件bootBlazorORM元件
- 表單驗證使用擴充套件套件
- jQuery表單驗證效果詳解jQuery
- 純CSS實現表單驗證CSS
- SpringMVC表單驗證器的使用SpringMVC
- JavaScript表單不為空驗證JavaScript
- css 表單標籤兩端對齊CSS
- 表單驗證自定義格式輸出
- vue表單驗證 -- mmj-vue-vdVue
- Laravel 的 表單驗證,多場景Laravel