How to use HTML forms?

[FezVrasta]

Hi, how can I use the Form controls with an actual HTML form? I can't set a type=submit property on buttons, and there's no Form component either.

[albertcito]

The button should have an attribute to change the type but it doesn't have it. Also, this library should provide a form tag in order to make it accessible for web (I created an issue).

The temporal solution is. Add to your form this hidden button:

{Platform.OS === 'web' && (<button type="submit" className="hidden"  />)}

Also create an extra component called UForm:

import { Platform } from 'react-native';

export default function UForm({
  children,
  ...props
}: React.FormHTMLAttributes<HTMLFormElement>) {
  if (Platform.OS === 'web') {
    return (<form {...props}>{children}</form>);
  }
  return children;
}

Now create your form in this way using https://react-hook-form.com/get-started#ReactNative

<UForm onSubmit={handleSubmit(onSubmit)}>
   {/* Here your inputs */}
  <Button onSubmit={handleSubmit(onSubmit)}>
    <ButtonText>
      Save
    </ButtonText>
  </Button>
  {Platform.OS === 'web' && (<button
    type="submit"
    className="hidden"
  />)}
</UForm>