reactjs - Formik 和 Yup - 如何为数组和字符串创建模式

Question

我正在使用 Formik 创建图书图书馆的形式，其中列表中的每个项目如下所示:

author: {
 name: 'string',
 titles: ['string']
}

我在尝试使用 Yup 来验证这些字段时遇到问题。我有:

schema = Yup.object().shape({
 author: Yup.object().shape({
  name: Yup.string().min().max().required('...')
 }),
 author: Yup.array().of(
  Yup.object().shape({
   titles: Yup.string().min().max().required('...')
  })
 )
});

初始值也是:

{
 author: {name: ''},
 author: [{ titles: '' }]
}

我的验证适用于数组，但不适用于名称。我假设问题是我不能为对象中的两个元素使用相同的名称，但是我不知道如何在初始值和模式中组合这两个字段。我查看了 Yup API 并注意到他们有 mixed() 但我不明白如何实现我需要的东西。这种方式是否可行，或者对这两种方式都可能进行验证？

Answer 1

Author 不是一个数组，它是一个包含数组和字符串的对象。另外，你定义了两次:

schema = Yup.object().shape({
 author: Yup.object().shape({
  name: Yup.string().min().max().required('...'),
  titles: Yup.arrayOf(Yup.string())
 }),
});

对为什么您有 2 个作者 key 感到困惑。上面的架构对应于:

{
  author: {
    name: "hehyryg",
    titles: ["title", "title2"]
  }
}