如何使用 React 和 Yup 验证（没有 Formik）

Question

知道如何使用 Yup（不带 Formik）进行 React 输入验证吗？

我在网上找不到任何好的例子。谢谢

Answer 1

You can use cast() if u want to use yup without formik, see example :

let yup = require('yup');

let schema = yup.object().shape({
  name: yup.string().required(),
  age: yup
    .number()
    .required()
    .positive()
    .integer(),
  email: yup.string().email(),
  website: yup.string().url(),
  createdOn: yup.date().default(function() {
    return new Date();
  }),
});

// check validity
schema
  .isValid({
    name: 'jimmy',
    age: 24,
  })
  .then(function(valid) {
    valid; // => true
  });

// you can try and type cast objects to the defined schema
schema.cast({
  name: 'jimmy',
  age: '24',
  createdOn: '2014-09-23T19:25:25Z',
});
// => { name: 'jimmy', age: 24, createdOn: Date }

Answer 2

Formik 在 React 中处理表单，将输入标签绑定到模型，该模型可以包含验证器，验证器可以是 Yum 或任何其他形式的验证。

如果您不想使用 Formik，那么您可以使用另一个表单处理库来进行反应，例如FormState。

如果您根本不想使用表单处理库，那么您必须手动完成这一切。