Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6213

unable to submit form when using flatList

$
0
0

My code looks like this. Previously, I was rendering and mapping some data using another component called UserList. However, now I have changed it to a FlatList

When I was using {/* <UserList onSendRequest={onSendRequest} data={userData}></UserList> */}, every time I clicked on the button, the handleSubmit function was called successfully.

However, now that I am using FlatList, nothing happens when I click on the button. The handle submit doesn't run and hence I don't see anything from the flatList. What am I doing wrong?

  return (<SafeAreaView><View><View style={styles.searchTopContainer}><View style={styles.searchTopTextContainer}><Text>              Cancel</Text></View><View><Formik              initialValues={initialValues}              onSubmit={handleSubmitForm}              validationSchema={validationSchema}>              {({ handleChange, handleBlur, handleSubmit, values }) => (<View style={styles.searchFieldContainer}><View style={styles.form}><FieldInput                      handleChange={handleChange}                      handleBlur={handleBlur}                      value={values.input}                      fieldType="input"                      icon="user"                      placeholderText="Email or Phone Number or Name"                    /><ErrorMessage                      name="input"                      render={(msg) => (<Text style={styles.errorText}>{msg}</Text>                      )}                    /></View><View style={styles.buttonContainer}><Button                      rounded                      style={styles.searchButton}                      onPress={handleSubmit}><Text style={styles.searchButtonText}>Search </Text></Button></View></View>              )}</Formik></View>          {/* <UserList onSendRequest={onSendRequest} data={userData}></UserList> */}          {userData !== null && <FlatList            data={userData.users}            horizontal={false}            renderItem={({ item }) => (<SingleUser                user={item}                onSendRequest={onSendRequest}              />            )}            keyExtractor={(item) => item.id.toString()}          />            }</View></View></SafeAreaView>  );};

Viewing all articles
Browse latest Browse all 6213

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>