multi_step_form.tsx 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  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. gender: '',
  12. password: '',
  13. email: '',
  14. birthDate: '',
  15. isUberDriver: undefined,
  16. vehicleType: '',
  17. vehicleModel: '',
  18. licensePlate: '',
  19. address: '',
  20. paymentMethod: ''
  21. });
  22. //logging to check if parent component can successfully receive user input in the multi-step form
  23. useEffect(() => {
  24. console.log(formData);
  25. }, [formData]);
  26. return (
  27. <View style={styles.container}>
  28. <Form formData={formData} setFormData={setFormData} />
  29. <StatusBar style="auto" />
  30. </View>
  31. );
  32. };
  33. const styles = StyleSheet.create({
  34. container: {
  35. flex: 1,
  36. backgroundColor: '#FFFFFF'
  37. }
  38. });
  39. export default MultiStepForm;