@@ -50,7 +50,7 @@ export default () => {
5050
5151 return (
5252 < React . Fragment >
53- < Field name = "username" rules = { [ { required : true } ] } >
53+ < Field name = "username" rules = { [ { required : true , groupId : 'GroupA' , id : '1' } ] } >
5454 < Input
5555 placeholder = "Username"
5656 onChange = { ( { target : { value } } ) => {
@@ -64,8 +64,10 @@ export default () => {
6464 < Field
6565 name = "password"
6666 rules = { [
67- { required : true } ,
67+ { required : true , groupId : 'GroupA' , id : '2' } ,
6868 context => ( {
69+ groupId : 'GroupA' ,
70+ id : '3' ,
6971 validator ( _ , __ , callback ) {
7072 if ( context . isFieldTouched ( 'password2' ) ) {
7173 context . validateFields ( [ 'password2' ] ) ;
@@ -85,8 +87,10 @@ export default () => {
8587 < Field
8688 name = "password2"
8789 rules = { [
88- { required : true } ,
90+ { required : true , groupId : 'GroupB' , id : '4' } ,
8991 context => ( {
92+ groupId : 'GroupB' ,
93+ id : '5' ,
9094 validator ( rule , value , callback ) {
9195 const { password } = context . getFieldsValue ( true ) ;
9296 if ( password !== value ) {
@@ -102,7 +106,7 @@ export default () => {
102106 < FieldState form = { form } name = "password2" />
103107 < Error > { password2Error } </ Error >
104108
105- < Field name = "renderProps" rules = { [ { required : true } ] } >
109+ < Field name = "renderProps" rules = { [ { required : true , id : '6' } ] } >
106110 { ( control , meta ) => (
107111 < div >
108112 Use Meta:
@@ -117,8 +121,9 @@ export default () => {
117121 name = "validateTrigger"
118122 validateTrigger = { [ 'onSubmit' , 'onChange' ] }
119123 rules = { [
120- { required : true , validateTrigger : 'onSubmit' } ,
124+ { required : true , validateTrigger : 'onSubmit' , id : '7' } ,
121125 {
126+ id : '8' ,
122127 validator ( rule , value , callback ) {
123128 setTimeout ( ( ) => {
124129 if ( Number ( value ) . toString ( ) === value ) {
@@ -155,6 +160,38 @@ export default () => {
155160 >
156161 Validate All
157162 </ button >
163+ < button
164+ type = "button"
165+ onClick = { ( ) => {
166+ form . validateFields ( {
167+ groupId : 'GroupA' ,
168+ } ) ;
169+ } }
170+ >
171+ Validate GroupA
172+ </ button >
173+ < button
174+ type = "button"
175+ onClick = { ( ) => {
176+ form . validateFields ( {
177+ groupId : 'GroupB' ,
178+ } ) ;
179+ } }
180+ >
181+ Validate GroupB
182+ </ button >
183+ < button
184+ type = "button"
185+ onClick = { ( ) => {
186+ form . validateFields ( {
187+ ignore : ( rule ) => {
188+ return ( Number ( rule . id ) % 2 ) === 0
189+ }
190+ } ) ;
191+ } }
192+ >
193+ Validate Logical
194+ </ button >
158195
159196 < button type = "submit" > Submit</ button >
160197 </ React . Fragment >
0 commit comments