Call function inside of Flatlist

745 views Asked by At

I have a function checkStatus(id) which requires the item.id from a flatlist.

I am able to check the status in an onPress event within the flatlist like:

<TouchableOpacity onPress={() => checkStatus(item.id)}>

However, I would like the function to be called for each item in the Flatlist and render some text accordingly. When the function is called, i have a const whose state changes with a boolean. (hasBeenAdded = true or false) So, I don't want any onPress event.

I have done something similar before, but it didnt require a value of the item and thus I could just call it like

 {hasBeenAdded === true (
): }

Any idea of how I could call the function inside the flatlist for each item?

1

There are 1 answers

0
Fiona On

I found the solution!

After I changed the flatlist so that I used renderItem in another component, I was able to run my function in there before the return method.

        function cell ({item, index}){
      const filterData=  global.myData.filter(data => data.sugg == item.id)
    
    
      return (
              
   <Text style={styles.row}>{item.title}</Text>
        <Text style={styles.row}>{item.description}</Text>
     
    
        {!filterData.length ? (
      <Text> Some text </Text>
      
     />
        ): (
        <Text> Some other Text </Text>
         
        />
        )}
   
 
      )
    }
    
    
      return (

 
          <FlatList
            data={myFilter}
            keyExtractor={(item, data) => { return item.id}}
            renderItem={cell  }
            style={{ marginTop: 10 }} />
)