input输入框加验证规则组件(vue)

输入框组件(带验证规则)
效果图:
在这里插入图片描述

组件名:my-input
可传参数

type1 input类型
value 默认值
rule 验证规则
rule参数 规则
trigger 事件名称 (str)
min 最小值(number)
max 最大值 (number)
required 是否不能为空(str)
reg 正则表达式验证规则(//)
num_message 长度出错提示(str)
req_message 必传出错提示(str)
reg_message 正则匹配错误提示(str)

代码:
组件代码:input输入框加验证规则组件(vue)_第1张图片input输入框加验证规则组件(vue)_第2张图片
input输入框加验证规则组件(vue)_第3张图片
input输入框加验证规则组件(vue)_第4张图片

外部引入组件代码:
input输入框加验证规则组件(vue)_第5张图片

尚在改进中,有不足请见谅

你可能感兴趣的:(input输入框加验证规则组件(vue))