web-dev-qa-db-ja.com

yupとformikによるパスワード検証

パスワード検証をどのように行うのですか?同時に、エラーを別の変数に渡すのですか?

つまり

password: Yup.string().required("Please provide a valid password"),
passwordMin: Yup.string().oneOf([Yup.ref('password'), null]).min(8, 'Error'),
passwordLC: Yup.string().oneOf([Yup.ref('password'), null]).matches(/[a-z]/, "Error" )
passwordUC: Yup.string().oneOf([Yup.ref('password'), null]).matches(/[A-Z]/, "Error" )

パスワード変数のバインドを取得して、パスワードオブジェクトにバインドできません

10
Strahinja Ajvaz

Efleurineの回答について詳しく説明します。
各検証を同じフィールドに保存する必要はありません。それらをチェーンして完全な検証を取得できます。

password: Yup.string()
  .required('No password provided.') 
  .min(8, 'Password is too short - should be 8 chars minimum.')
  .matches(/[a-zA-Z]/, 'Password can only contain Latin letters.')

失敗ごとに個別のメッセージを指定できることに注意してください。
また、バインドを機能させるには、バインドするフォーム入力に適切なname属性(この場合はpassword)があることを確認してください。

10
VBorisoff

同じ要素に対して検証をチェーンできることは知っています。相互検証を実行しようとしている場合は、この記事が役立ちます。 formikについては反応しますが、あなたのケースを解決する方法についてのアイデアをあなたに与えるでしょう。

https://itnext.io/simple-react-form-validation-with-formik-yup-and-or-spected-206ebe9e7dcc

0
efleurine