Since the update to React18 I have the problem with i18next that I can no longer write variables in labels or similar.
The following code worked without problems in React17:
<Field>
<label className={"p-error"}>{errors.username?.message}</label>
</Field>
But since react18 I get the following error message:
TS2322: Type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>> | undefined' is not assignable to type 'ReactI18NextChild | Iterable<ReactI18NextChild>'. Type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>>' is not assignable to type 'ReactI18NextChild | Iterable<ReactI18NextChild>'. Type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>>' is missing the following properties from type 'ReactPortal': key, children, type, props
I have read that in the current version it should be possible to set the allowObjectInHTMLChildren option somewhere so that this error no longer happens, however I am not clear where I can set this option. I tried it in the init method of i18next, but there this option is not available.