title: How do I change the state present in a specific item within a flatlist?
body: <p>I am generating a flatlist that contains comments. Inside the comment component, I'm using a state isCollpsed to determine if the individual comment is collapsed or not. Pressing on each individual comment does make it collapse. However, I want to manipulate this state from the parent component without affecting every other comment. How could I achieve this?</p>
  <p>I tried using the reference hook to access each individual item in the flatlist but it keeps returning 'undefined'. I'm using the react-native-collapsible library to collapse the comments.</p>
  <p>My Flatlist:</p>
  <pre><code> &lt;FlatList
                      data={SAMPLE_COMMENTS}
                      keyExtractor={keyExtractor}
                      renderItem={({item})=&gt;
                      
                      
                      &lt;Comment 
                                  ref={(el) =&gt; {rowRefs.current[item.id] = el} } 
                                  onPress={()=&gt;{rowRefs.current[item.id].collapseFunction()}}
                                  body={item.body} 
                                  author={item.author} 
                                  level={item.level} 
                                  createdAt={item.createdAt} 
                                  commentId={item.id} 
                                  commentChildren={item.replies} /&gt;}
                  
                  /&gt;
  </code></pre>
  <p>Comment Component :</p>
  <pre><code>const [isCollapsed, setIsCollapsed] = useState(false);
  const collapseFunction = () =&gt; {setIsCollapsed(!isCollapsed)};
  
  
  
  return (
      &lt;Collapsible  collapsed={isCollapsed}&gt;
      
          &lt;TouchableWithoutFeedback onPress={onPress}&gt;
              &lt;View style={styles.container}&gt;
          
  
              &lt;/View&gt;
          &lt;/TouchableWithoutFeedback&gt;
  
      &lt;/Collapsible&gt;
  </code></pre>