title: FlatList item doesn't update when I setState()
body: <p>I'm building multiple select modal. When user press the item, the item should be marked as 'Checked'. </p>
  
  <p><strong>Problem</strong> I added/removed id from id arrays. When I open and check modal, it doesn't show 'Check' sign. But when I close and open the modal again, it shows 'Check' Sign. </p>
  
  <p><a href="https://i.stack.imgur.com/JN3LA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JN3LA.png" alt="enter image description here"></a></p>
  
  <p>To keep track of selected items, I defined the items in the modal component's state. </p>
  
  <pre><code>  state = {
      selectedSeasonIds: this.props.selectedSeasonIds,
     }
  </code></pre>
  
  <p>Here is react-native-modal which I use to show modal on the screen</p>
  
  <pre><code>&lt;Modal
        isVisible={isSelectorVisible}
        onBackdropPress = {() =&gt; this.props.hideSelector()}&gt;
        &lt;View style={styles.modalContainer}&gt;
            &lt;FlatList
                style={styles.root}
                data={this.props.items}
                ItemSeparatorComponent={this._renderSeparator}
                keyExtractor={this._keyExtractor}
                renderItem={this._renderItemForMultiple}/&gt;
        &lt;/View&gt;
  &lt;/Modal&gt;
  </code></pre>
  
  <p>This is render function for each item</p>
  
  <pre><code>_renderItemForMultiple = ({item}) =&gt; {
      return (
        &lt;TouchableOpacity
          style={styles.itemStyle}
          onPress={() =&gt; {this._handleMultipleItemPress(item.id)}}&gt;
          &lt;RkText&gt;{item.value}&lt;/RkText&gt;
          { this._renderCheck(item.id) }   &lt;&lt;&lt; Here is the problem
        &lt;/TouchableOpacity&gt;
      );
    }
  </code></pre>
  
  <p>When user clicks the item, FlatList's item calls <code>_handleMultipleitemPress</code></p>
  
  <pre><code>  _handleMultipleItemPress = (id) =&gt; {
      let { selectionType } = this.props;
      let { selectedSeasonIds, selectedSizeIds, selectedColorIds } = this.state;
      if(selectionType===2) {
        if(_.includes(this.state.selectedSeasonIds, id)) {
          let newSelectedSeasonIds = _.filter(this.state.selectedSeasonIds, (curObject) =&gt; {
              return curObject !== id;
          });
          this.setState({selectedSeasonIds : newSelectedSeasonIds});
        } else {
          let newSelectedSeasonIds = [...this.state.selectedSeasonIds, id];
          this.setState({selectedSeasonIds : newSelectedSeasonIds});
        }
      }
      // season Select Action
      this.props.seasonSelectAction(id);
    }
  </code></pre>
  
  <p><strong>Problem</strong> We added/removed id from id arrays. When I open and check modal, it doesn't show 'Check' sign. But when I close and open the modal again, it shows 'Check' Sign. </p>
  
  <p>Somehow the modal is not rendered even eventhough we <code>setState</code> in <code>renderCheck()</code>. Why is it happening? And How can I fix it?</p>
  
  <pre><code>  _renderCheck = (id) =&gt; {
      let { selectionType, selectedSeasonIds, selectedSizeIds, selectedColorIds } = this.props;
      if(selectionType===2) {
        if(_.includes(this.state.selectedSeasonIds, id)) {
          return (&lt;RkText&gt;Check &lt;/RkText&gt;);
        }
      } 
      return (&lt;RkText&gt; &lt;/RkText&gt;);
    }
  </code></pre>
  
  <p>Any other advice will be also appreciated! Thanks for reading this post.</p>
  
  <p><strong>UPDATE</strong> I debugged with code and when I press the item, it doesn't go through <code>_renderItemForMultiple</code>. I think it's because I didn't define a param for <code>_renderItemForMultiple</code>. How can I pass item to its param? Any idea?</p>