multi_step_form.tsx 1013 B

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import { Text, View, StyleSheet } from "react-native";
  2. import { StatusBar } from "expo-status-bar";
  3. import Form from "./formComponent/form";
  4. import { useEffect, useState } from "react";
  5. import { SignUpFormData } from "../../types/signup";
  6. const MultiStepForm: React.FC = () => {
  7. const [formData, setFormData] = useState<SignUpFormData>({
  8. phone: "",
  9. phoneVerificationStatus: false,
  10. name: "",
  11. password: "",
  12. email: "",
  13. birthDate: "",
  14. isUberDriver: undefined,
  15. vehicleType: "",
  16. vehicleModel: "",
  17. licensePlate: "",
  18. address: "",
  19. paymentMethod: "",
  20. });
  21. //logging to check if parent component can successfully receive user input in the multi-step form
  22. useEffect(() => {
  23. console.log(formData);
  24. }, [formData]);
  25. return (
  26. <View style={styles.container}>
  27. <Form formData={formData} setFormData={setFormData} />
  28. <StatusBar style="auto" />
  29. </View>
  30. );
  31. };
  32. const styles = StyleSheet.create({
  33. container: {
  34. flex: 1,
  35. backgroundColor: "#FFFFFF",
  36. },
  37. });
  38. export default MultiStepForm;