使用react写表单组件,表单验证如果做比较好?
使用react写了一个基础组件input ,使用地方很多,有的地方需要检验只能输入数字,有的地方需要检验只能输入汉字,那么怎么做表单检验比较好?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
使用react写了一个基础组件input ,使用地方很多,有的地方需要检验只能输入数字,有的地方需要检验只能输入汉字,那么怎么做表单检验比较好?
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
接受
或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
发布评论
评论(5)
可以参考一下蚂蚁金服的组件库ant-design里面的Form,是基于react-component的form和form-validation,这是我见过的最好用,对业务兼容性最好的表单组件了。
可以在组件内部把数字和汉字用正则匹配好,然后通过props传入不同的属性来验证各个不同的值,然后通过回调函数来做表单提交
私以为,表单验证分为实时验证和非实时验证。那么触发表单验证的时机控制就很重要了。如果使用了react来写组件,那么在input发生onChange事件时往往需要setState,这时如果触发表单验证,就是实时验证了。如果想做到非实时验证,例如用户在点击提交时再提示用户错误信息的话,就要加逻辑判断以确定是否触发表单验证了。
github上查找async-validate
当然是在父组件给个参数阿
在子组件里面去写这个方法,如果给了这个props或者这个props=true的时候就去执行这个方法
例如
类似于这样