Estoy usando react-native y react-hook-form con react-native-toast-notifications para mostrar errores en mi formulario. Quiero activar un brindis. mostrar ('mi mensaje personalizado') si hay un error de validación particular en el campo, el componente se ve así:

 export default function RegisterScreen(props) { // we initialize Toasts const toast = useToast(); // loading state const [loading, setLoading] = useState(false); // we manage the errors const [newError, setNewError] = useState(); // we setup the use of dispatch const dispatch = useDispatch(); // setup of our form const { control, handleSubmit, formState: { errors }, } = useForm(); // our submit handler const onSubmit = async data => { setLoading(true); setNewError(null); console.log(data); try { await dispatch(authActions.signup(data.email, data.password)); } catch (err) { toast.show(err.message, { type: 'danger', duration: 4000 }); setLoading(false); } }; // returning the view return ( <> <ScrollView> {errors.email && toast.show('email invalid')} <Controller control={control} rules={{ required: true, }} render={({ field: { onChange, onBlur, value } }) => ( <Input placeholder='Solo emails válidos' onBlur={onBlur} onChangeText={onChange} value={value} error={errors.email} name={t('auth:email')} autoFocus keyboardType='email-address' autoComplete='email' autoCorrect={false} returnKeyType='next' textContentType='emailAddress' /> )} name='email' /> </> ); }

Al activar el error.email, quiero generar un Toast, pero me dice "Error: las cadenas de texto deben procesarse dentro de un componente". Probé también {error.email && ()=> toast.show('my message') y tampoco funciona.