ivew form 表单验证自定义添加的字段 输入框只能是数字小数

78 篇文章 2 订阅
52 篇文章 1 订阅
<FormItem class="table-input" :rules="Rules" :prop="`List[${index}].name`">
	<Input size="small" :disabled="disabledAll" @input="FreqInput(tableData.List[index].name,index,'List','name',false)" v-model="tableData.List[index].name"></Input>
</FormItem>
data(){
return {
formRangeRules: [{
	required: true, type: 'string', message: "",
		validator: (rule, value, callback) => {
		...
		}
	}],}
}
methods: {
FreqInput: debounce(function (num, index, type, chin, isclear) {
	// 去掉空格
	if (num.toString().split(" ").join("").length === 0) {
		let reg = new RegExp(' ', 'g');//g,表示全部替换。
		this.tableData[type][index][chin] = num.replace(reg, '');
	} else {
		let isnmber = Number(num);
		if (isnmber || isnmber === 0) {
			if (num.substr(0, 1) === '.') {
				this.tableData[type][index][chin] = isnmber;
			}
			// 判断长度
			if (Number(num) >= 10000000) {
				if (isclear) {
					this.tableData[type][index][chin] = "";
				}
			} else {
				if (num && num.toString().includes(".")) {
					if (num.toString().split(".")[1].length > 6) {
						this.tableData[type][index][chin] = this.toFixed(num, 6)
					}
				}
			}
		} else {
			this.tableData[type][index][chin] = "";
		}
	}
}, 300),
}
		/**
		 * 函数节流
		 * @param fn
		 * @param interval
		 * @returns {Function}
		 * @constructor
		 */
	function Throttle(fn, t) {
		let last;
		let timer;
		let interval = t || 500;
		return function () {
			let args = arguments;
			let now = +new Date();
			if (last && now - last > interval) {
				clearTimeout(timer);
				timer = setTimeout(() => {
					last = now;
					fn.apply(this, args);
				}, interval);
			} else {
				last = now;
				fn.apply(this, args);
			}
		};
	}
	/**
	 * 函数防抖 (只执行最后一次点击)
	 * @param fn
	 * @param delay
	 * @returns {Function}
	 * @constructor
	 */
	function debounce(fn, t) {
		let delay = t || 500;
		let timer;
		return function () {
			let args = arguments;
			if (timer) {
				clearTimeout(timer);
			}
			timer = setTimeout(() => {
				timer = null;
				fn.apply(this, args);
			}, delay);
		};
	}		
在使用ivew的表单form时,如果在弹窗model展示筛选列表后再复制input的情况下,可能会出现表单验证报错的问题。这是因为单个参数的验证类型的问题。当参数的trigger为"blur"时,无法判断参数的值是否有变化,即使input已经有值,仍然会报错。解决办法是将trigger的值改为"change"模式,这样就可以避免报错了。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [iview组件form表单的验证报错问题解决](https://blog.csdn.net/lyz246859/article/details/129265819)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [Vue ElementUI之Form表单验证遇到的问题](https://download.csdn.net/download/weixin_38689113/13608824)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [el-form表单验证报错[Element Warn][Form]model is required for validate to work!](https://blog.csdn.net/weixin_45812336/article/details/120978860)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值