javascript - Formik validation calling hooks outside a function

Question

I am trying to use Formik to validate a users input into a form. I seem to be getting an error of invalid hook call.

function UserRegistration  (props)  {
  const Stack = createStackNavigator();
  const { handleSubmit } = props;
  const onSubmit = (values) => console.log(values);
  const renderInput = ({ input: { onChange, ...input }, ...rest}) => {
  return <TextInput style= {CreditRegStyle.input} onChangeText={onChange} {...input} {...rest}/>};
  const {deviceHeight, deviceWidth } = Dimensions.get('window')
  let keyboardVerticalOffset = -50;
  const smallDeviceHeight = 650;

  const formik = useFormik({
    initialValues: {
      full_name: "",
      last_name: "",
      email_address: "",
      Day: "",
      Month: "",
      Year: "",
    }
  });
  return (
    
    <KeyboardAvoidingView
      style={CreditRegStyle.container}
      behavior="padding"
    >
    <View style={CreditRegStyle.Header}>
      <Text style={CreditRegStyle.Header}>
        Basic Details
      </Text>
  
      <Text style={CreditRegStyle.Text}>
      We need some details from you to process your application!
      </Text>
   
      <Field
        style={CreditRegStyle.FirstName}
        type="first_name"
        name="first_name"
        onChange={handleChange}
        onBlur={handleBlur}
        value={values.first_name}
        props={{
          placeholder: 'First Name'
        }}
        component={renderInput}
      />

Then here is the export function.

export default UserRegistration({
  mapPropsToValues: () => ({ first_name: '', last_name: '', email_address: '', Day: '', Month: '', Year: '',  }),
  validationSchema: ProfileSchema,
  handleSubmit: (values, { setSubmitting }) => {
    setTimeout(() => {
      alert(JSON.stringify(values, null, 2));
      setSubmitting(false);
    }, 1000);
  },
  displayName: 'UserRegistration'
})(UserRegistration);

I have tried everything and this error is not very forthcoming so I am unable to work out where the error is and how to solve it.

question from:https://stackoverflow.com/questions/66059304/formik-validation-calling-hooks-outside-a-function

Answer 1

Waitting for answers