我有自定义组件的输入formik
和它里面我呈现错误标签,如果存在。
如果我把它打印成:{errors[field.name]}
它工作
但是{t(errors[ www.example.com ]?.toLocaleString())} this doesn't.
import { FieldProps, FormikErrors } from "formik";
import { useTranslation } from "react-i18next";
const InputField: React.FC<InputFieldProps & FieldProps> = ({
field,
form: { touched, errors },
type,
label,
...props
}) => {
const { t } = useTranslation();
return (
<div>
<label
htmlFor={field.name}>
{label}
</label>
<input
type={type}
{...field}
{...props}/>
{touched[field.name] && errors[field.name] && (
<div>
<p>
{errors[field.name]}
{t(errors[field.name])} <---- this does not work
</p>
</div>
)}
</div>
);
};
export default InputField;
我收到错误:
Argument of type 'string | FormikErrors<any> | string[] | FormikErrors<any>[] | undefined' is not assignable to parameter of type 'TemplateStringsArray | Normalize<{test: 'test'}> | (TemplateStringsArray | Normalize<...>)[]'.
4条答案
按热度按时间ffdz8vbo1#
useFormik()
出现了这个问题,我能够安全地将错误转换为这样7gyucuyw2#
errors[field.name]?.toLocaleString()
中的?
表示:如果errors[field.name]
上不存在toLocaleString
属性,则返回undefined
。然后,它尝试将undefined
传递到t()
,这超出了它的定义,这就是为什么您会看到错误😉。但是,您可能不需要可选的链接,因为在它上面的4行中,您已经在检查属性
[field.name]
。删除
?
应该可以修复它。试试t(errors[field.name].toLocaleString())
,让我知道它是否有效。6uxekuva3#
只需使用
typeof errors[field.name] === 'string'
来确保typescript是一个字符串。Playground
42fyovps4#
这是我如何解决它我得到同样的错误在formik与mui图书馆