Forms & Validation

Controlled inputs with useState work for simple forms. For complex forms use react-hook-form or Formik. Validate on submit and show inline errors.

Building forms in React Native

Controlled inputs with useState work for simple forms. For complex forms use react-hook-form or Formik. Validate on submit and show inline errors.

const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [errors, setErrors] = useState<Record<string, string>>({});

function validate() {
  const e: Record<string, string> = {};
  if (!email.includes("@")) e.email = "Invalid email";
  if (password.length < 6) e.password = "Min 6 characters";
  setErrors(e);
  return Object.keys(e).length === 0;
}

function handleSubmit() {
  if (!validate()) return;
  // call API...
}

Keyboard handling

KeyboardAvoidingView — shifts content when keyboard opens (behavior='padding' on iOS).
keyboardShouldPersistTaps='handled' on ScrollView — taps work while keyboard is open.
TouchableWithoutFeedback + Keyboard.dismiss() — tap outside to close keyboard.