javascript - Formik - 在错误消息中使用大写首字母字段名称

标签 javascript react-native formik

是否可以在 Formik 错误消息中使用大写字段名称,而不必为每个字段定义自己的自定义错误消息?我正在使用 native react 。

我不得不用大写字母命名 Formik 字段值,但我不想这样做。

带有大写首字母字段名称的 formik 增强器代码:

const formikEnhancer = withFormik({
  validationSchema: Yup.object().shape({
    Name: Yup.string().required(),
    Brand: Yup.string().required(),
    GroceryStore: Yup.object()
      .shape({
        city: Yup.string(),
        latitude: Yup.number(),
        longitude: Yup.number(),
        name: Yup.string(),
        place_id: Yup.string(),
        street: Yup.string(),
        street_number: Yup.string(),
        suburb: Yup.string()
      })
      .required(),
    Image: Yup.object().shape({
      uri: Yup.string(),
      name: Yup.string(),
      type: Yup.string()
    }),
    Categories: Yup.array()
      .min(1, 'Please select at least 1 Category')
      .required(),
    Description: Yup.string()
      .min(9)
      .required(),
    Price: Yup.string().matches(
      /^\d+(?:\.\d{2})$/,
      'Price must contain 2 decimal places (cents) e.g. 4.00'
    )
  }),
  isInitialValid: false,
  mapPropsToValues: () => ({
    Name: '',
    Brand: '',
    Description: '',
    Price: '',
    Categories: [],
    GroceryStore: {},
    Image: {}
  }),
  handleSubmit: (values, { props }) => {
    handleSubmit(values, props)
  },
  displayName: 'AddGroceryItemView'
})(AddGroceryItemView)

最佳答案

改为提供标签。

因此,对于street: Yup.string(),您可以编写street: Yup.string().label('Street')。 如果您有多个单词(例如 street_number),这也会有所帮助,因此您需要编写 street_number: Yup.string().label('Street Number')

关于javascript - Formik - 在错误消息中使用大写首字母字段名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57902429/

相关文章:

javascript - 在 View 组件中使用字符串变量导致 "Unexpected text node"

reactjs - 如何使用字段数组删除formik值

javascript - mozilla 中的 KeyCode 出现错误

java - 使用 EAS 构建构建应用程序时出现 "expo-location:compileReleaseJavaWithJavac"错误

react-native - react native : Optimized SectionList does not rerender after scrollToLocation

javascript - 是的条件验证

javascript - 如何正确使用 Formik 的 setError 方法? ( react 库)

javascript - 使用 $.each 循环 JQuery 将 td 附加到行

javascript - 在 ReactJS 中使用 react 聊天元素

javascript - 如果删除了对应的rails View 模板,还可以删除js文件吗?