element输入框el |
您所在的位置：网站首页 › el-input限制输入数字大小 › element输入框el |
|
element输入框el-input之格式控制 （1）限制输入的长度：maxlength最大，minlength最小，maxlength=“5”; （2）页面显示限制字数show-word-limit （3）出现字数限制提示时，最后几个字会被提示遮挡 // 输入框限制字数 .el-textarea .el-input__count { background: none; }在输入的时候控制 （3）只能输入数字：οninput="value = value.replace(/[^\d]/g, ‘’), 扩展：oninput事件是原始input元素的事件，在输入框中输入时就会触发 （4）只能输入数字和小数点οninput=“value = value.replace(/[^\d.]/g, ‘’)” （5）只能输入数字和小数点，并且用千分号分隔，并且保留小数点后两位，在值变化的时候处理输入内容@change=“changePrice” changePrice(val) { this.goodsRuleForm.price = this.rbstateFormat(val); },（6）调用数据格式化方法 参考加千分位，保留俩位小数格式 // 金额千分位和保留小数点后两位 rbstateFormat(cellValue) { if (cellValue !== null) { if (String(cellValue).includes(".")) { cellValue = Number(cellValue).toFixed(2); } cellValue += ""; if (!cellValue.includes(".")) cellValue += "."; return cellValue .replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) { return $1 + ","; }) .replace(/\.$/, ""); } },在校验的时候控制格式 （1）使用prop （2）在rules加校验规则 cetificateNo: [ { required: true, validator: checkCetificateNo, trigger: ["blur", "change"], }, ],（3）checkCetificateNo写在data的return外 let checkCetificateNo = (rule, value, callback) => { const reg = /^[A-Za-z0-9]*$/; const valueLength = value?.toString().length; const testList = [this.IDCard, this.companyID]; if (value && testList.includes(this.addRuleForm.certificateType)) { if (valueLength !== 15 && valueLength !== 18) { callback(new Error("请输入15或18位字母或数字")); } else if (valueLength === 15 || valueLength === 18) { if (!reg.test(value)) { callback(new Error("请输入15或18位字母或数字！")); } else { callback(); } } } else if (!value) { callback(new Error("请输入证件号码")); } callback(); }; |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |