reactjs - Jag vill verifiera angivet lösenord med hjälp av react och ant.design (antd)

Jag har två fält, lösenord och bekräfta lösenord. Jag skulle vilja validera att det inmatade lösenordet i fältet "bekräfta lösenord" är samma som det som matades in i lösenordsfältet. Jag använder antd-ramverket. Här är mitt kodstycke.

 <Row gutter={25} type="flex">
                    <Col xs={24} sm={12}>
                        <h4>Password</h4>
                        <FieldDecorator
                            form={this.props.form}
                            name={"Password"}
                            rules={[{ required: true, message: 'Please add a password' },
                            { min: 8, message: 'Password must have a minimum length of 8' },
                            {
                                pattern: new RegExp('^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[@$!%*?&])[A-Za-z\\d@$!%*?&]{8,}$'),
                                message: 'Password must contain at least one lowercase letter, uppercase letter, number, and special character'
                            }]}
                        >
                            <Input type="password" size="large" placeholder="********" />
                        </FieldDecorator>
                    </Col>
                    <Col xs={24} sm={12}>
                        <h4>Verify Password</h4>
                        <FieldDecorator
                            form={this.props.form}
                            name={"VerifyPassword"}
                            rules={[{ required: true, message: 'Please verify your password' }]}
                        >
                            <Input type="password" size="large" placeholder="********" />
                        </FieldDecorator>
                    </Col>
                </Row>

Jag vet att det finns ett val för validator som jag kan använda, men jag är inte säker på hur man använder det i det här fallet. Låt mig veta om du behöver mer information.

Svar #1

det finns ett exempel på antd.design-sidan:

https://ant.design/components/form/#components-form-demo-register

Relaterade artiklar