初学框架vue搭配vux使用发现这个UI库使用有些力不从心。下面说说自己在表单验证过程遇到的两个需求问题及解决的方法。
1。使用输入组件可知,官方只给了三种类型的类型将是验证器,分别是:电子邮件、china-name,中国移动,其他需要自己自定义验证器,怎么写验证器?
解决方法:自定义类型验证器(试验过可以在有效的使用正则验证)
& lt;输入类型="数量" v模型=按搿闭嘉环?扒胧淙胙橹ぢ搿?类型=癱odeValue”/比;
出口默认{
数据(){
返回{
代码:”,
codeValue:功能(价值){
返回{
有效:价值。长度===4,
味精:“验证码有误!”
}
}
}
}
}
2。表单内容都填写无误之后,提交表单的按钮才能被触发(如图)
解决方法:使用输入组件的@on-change事件,及裁判属性
& lt;输入类型="数量" v模型=按搿闭嘉环?扒胧淙胙橹ぢ搿?类型=癱odeValue ref=皉efcode @on-change=" keyDown "/比;
& lt; x键动作类型=疤峤弧?禁用=敖谩弊４峭瓿? lt;/x-button>
出口默认{
数据(){
返回{
代码:”,
禁用:没错,
codeValue:功能(价值){
返回{
有效:价值。长度===4,
味精:“验证码有误!”
}
}
}
},
方法:{
keyDown () {
如果(refs.refcode美元。有效的==true,,这一点。代码!=){
这一点。禁用=false。
其他}{
这一点。禁用=true。
}
}
}
}
以上所述是小编给大家介绍的Vue使用vux-ui自定义表单验证遇到的问题及解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留的言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
