Formik - 在错误消息中使用大写首字母字段名称
Formik - Use uppercase first letter field name in error messages
是否可以在 Formik 错误消息中使用大写字段名称,而不必为每个字段定义您自己的自定义错误消息?我正在使用本机反应。
我不得不用大写字母命名 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')
是否可以在 Formik 错误消息中使用大写字段名称,而不必为每个字段定义您自己的自定义错误消息?我正在使用本机反应。
我不得不用大写字母命名 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')