Hi, I'm having a "Render Error" when I'm submitting my form. My code:
import React from 'react';
import { Controller } from 'react-hook-form';
import { Input, InputProps } from '@components/core/Input';
import { MaskEnum } from '@enums/Mask';
import { Masks } from 'react-native-mask-input';
type ControllerInputProps = InputProps & {
control?: any;
name: string;
maskType?: string;
};
const ControlledInput = ({
title,
control,
name,
maskType,
...rest
}: ControllerInputProps) => {
function selectTypeMask(name: string) {
switch (name) {
case MaskEnum.CPF:
return Masks.BRL_CPF;
case MaskEnum.CEP:
return Masks.ZIP_CODE;
case MaskEnum.PHONE:
return Masks.BRL_PHONE;
case MaskEnum.BIRTH_DATE:
return Masks.DATE_DDMMYYYY;
}
}
return (
<Controller
name={name}
control={control}
rules={{ required: true }}
render={({ field: { onChange, onBlur, value } }) => (
<Input
title={title}
value={value}
onChangeText={masked => {
onChange(masked);
}} // send value to hook form
mask={selectTypeMask(maskType)}
onBlur={onBlur} // notify when input is touched
{...rest}
/>
)}
/>
);
};
export { ControlledInput };
My MaskedInput is inside this Input just for styles purpose.
All masks are working as expected, but when I submit the form it shows this error:
"Render Error: maskArray.find is not a function. (In 'maskArray.find(function (maskItem) { return Array.isArray(maskItem);})', 'maskArray.find' is undefined)"
I followed back to where this function might be and it was inside "useMaskedInputProps.tsx" file:
So I think it goes trough this verification, but thing is that I'm saying in my onChangeText that my item will be masked and not obfuscated, so I thought this function wouldn't cause any problems, but in some way that I'm not being able to understand, it is.
If anyone can enlighten me to where is the problem and how to fix it I'll be grateful :)
Hi, I'm having a "Render Error" when I'm submitting my form. My code:
My MaskedInput is inside this Input just for styles purpose. All masks are working as expected, but when I submit the form it shows this error:
"Render Error: maskArray.find is not a function. (In 'maskArray.find(function (maskItem) { return Array.isArray(maskItem);})', 'maskArray.find' is undefined)"
I followed back to where this function might be and it was inside "useMaskedInputProps.tsx" file:
So I think it goes trough this verification, but thing is that I'm saying in my onChangeText that my item will be masked and not obfuscated, so I thought this function wouldn't cause any problems, but in some way that I'm not being able to understand, it is.
If anyone can enlighten me to where is the problem and how to fix it I'll be grateful :)