reactjs - 如何从另一个文件导入 yup 模式？

Question

我想通过将模式放在单独的文件中来组织我的表单代码。我注意到，当我导出一个 yup 模式，然后将其导入另一个模式时，它总是失败。模式数据似乎是正确的(当我控制日志时)，但是，导入模式的验证从未运行。

例子:

myAdditionalSchema.js

export const otherSchema = object({
 someValue: string(),
})

myMainSchema.js

import { otherSchema } from "myAdditionalSchema"

export const constMainSchema = object({
  myValue: string(),
}).concat(otherSchema)

如果我在同一个文件中有所有这些模式，我不会遇到这个问题，只有在导入它们时才会遇到。

例如，这个有效:

export const constMainSchema = object({
  myValue: string(),
}).concat(object({
 someValue: string(),
}))

这也有效:

const otherSchema = object({
 someValue: string(),
})

export const constMainSchema = object({
  myValue: string(),
}).concat(otherSchema)

导入它们时我必须做些什么不同的事情吗？对于上下文，我将其与 Formik 一起使用。

Answer 1

事实证明这确实有效。 number().transform() 存在一个问题，在导入架构时导致错误(我不完全理解)。但是，当在同一文件中创建架构时，该错误不会持续存在。