title: React-Native FlatList with Individual state for every component
body: <p>Here is my code to display the FlatlList with order details on App. In the components of FlatList, radio button, icon and one button will be displayed. Whenever user will click on button, Radio button will be hidden (I'm handling this function with the help of state variables. The problem is whenever I click on button inside a component, Radio button and icon is show/hide in every component. I want it to be happened individually inside a component. So Radio Button and Icon will be Hidden/Shown inside the component I am working, not in other components. Kindly help this issue is wasting my lot of time. Thanks in advance!</p>
  
  <pre><code>&lt;FlatList
    data={this.state.dataSource2}
    extraData={this.state}
    keyExtractor={(item, index) =&gt; index}
    renderItem={({ item, index }) =&gt; (
      &lt;View style={styles.addressBox}&gt;
        &lt;Text style={styles.deliveryNumber}&gt; {index} &lt;/Text&gt;
        &lt;Text style={styles.pickupLocation1}&gt; Delivery Location &lt;/Text&gt;
        &lt;Text style={styles.address1}&gt;
          {' '}
          {item.flat_name} {item.building_name}
          {item.city}{' '}
        &lt;/Text&gt;
        &lt;Text style={styles.pickupLocation1}&gt;
          {' '}
          {item.f_name} {item.l_name}{' '}
        &lt;/Text&gt;
        &lt;Text style={styles.address1}&gt; {item.mobile} &lt;/Text&gt;
        {this.state.status == false ? (
          &lt;View style={styles.viewIcon}&gt;{myIcon}&lt;/View&gt;
        ) : null}
        {this.state.setStatus1 == false ? (
          &lt;View&gt;
            &lt;TouchableOpacity
              onPress={this.setOrderStatus}
              style={styles.statusButton}&gt;
              &lt;Text style={styles.statusButtonText}&gt;Status&lt;/Text&gt;
            &lt;/TouchableOpacity&gt;
          &lt;/View&gt;
        ) : null}
        {this.state.statusView1 == false ? (
          &lt;View style={styles.viewStatus}&gt;
            &lt;RadioForm
              radio_props={deliveryStatus}
              formHorizontal={true}
              buttonSize={10}
              buttonColor={'#7B1113'}
              labelStyle={{ fontSize: 13 }}
              onPress={value =&gt; {
                deliveryStatus.value;
              }}
            /&gt;
            &lt;TouchableOpacity
              onPress={this.setStatusFun2}
              style={styles.updateStatusButton}&gt;
              &lt;Text style={styles.buttonText}&gt;Update Status&lt;/Text&gt;
            &lt;/TouchableOpacity&gt;
          &lt;/View&gt;
        ) : null}
      &lt;/View&gt;
    )}
  /&gt;
  </code></pre>