diff --git a/with-react-hook-form/App.js b/with-react-hook-form/App.js new file mode 100644 index 00000000..baaebefd --- /dev/null +++ b/with-react-hook-form/App.js @@ -0,0 +1,114 @@ +import { View, Text, StyleSheet, TextInput, Button } from "react-native"; +import { useForm, Controller } from "react-hook-form"; + +const EMAIL_REGEX = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/; + +export default function App() { + const { + control, + handleSubmit, + formState: { errors }, + } = useForm({ + defaultValues: { + email: "", + password: "", + }, + }); + + const onSubmit = (values) => { + const { email, password } = values; + + alert(`Email: ${email}, Password: ${password}`); + }; + + return ( + + Email + ( + + )} + rules={{ + required: "Email is required.", + pattern: { + value: EMAIL_REGEX, + message: "Enter a valid email address.", + }, + }} + /> + {errors.email && {errors.email.message}} + + Password + ( + + )} + rules={{ + required: "Password is required.", + minLength: { + value: 6, + message: "Password must be at least 6 characters long.", + }, + }} + /> + {errors.password && ( + {errors.password.message} + )} + + +