title: React Native - Passing Strings or Variables via onPress
body: <p>This probably doesn't just apply to React Native, but I do want to understand what's happening here.</p>
  
  <p>Take the following 5 lines of code. Line 3 will cause the app not to render in Expo.</p>
  
  <pre><code>&lt;Button onPress={this.filterOfficeTypePitt} title="Pitt" /&gt;
  &lt;Button onPress={this.filterOfficeTypeAtl} title="Atl" /&gt;
  &lt;Button onPress={this.filterOfficeType("pitt")} title="DOES NOT WORK" /&gt;
  &lt;Button onPress={(e) =&gt; this.filterOfficeType("pitt")} title="Pitt" /&gt;
  &lt;Button onPress={(e) =&gt; this.filterOfficeType("atl")} title="Atl" /&gt;
  </code></pre>
  
  <p>I somewhat understand what is going on in each line.</p>
  
  <p>Line 1 and 2: Straight forward call to a method within the component.</p>
  
  <p>Line 3: Trying to do the same thing and pass a value. This causes the application to crash. Reason is maximum depth exceeded.</p>
  
  <p>Line 4 and 5: I think this is a function passing an anon function, and suddenly allowing me to add in a string value.</p>
  
  <p>Once I used 4 and 5, I was able to use a single method and have it filter the list. When I was using 1 and 2, I had to have a unique method for each.</p>
  
  <p>I just want to understand what it going on better and why exactly #3 will not work. I'm sure I need at least a better understanding of arrow functions.</p>
  
  <p>Including the code for the helper function. It basically grabs data from an index array and pushes it into a FlatList component.</p>
  
  <pre><code>filterOfficeType(officetype){
    let newarray = [];
    this.state.fulldataSource.forEach((element, index) =&gt; {
      if(element.office === officetype) {
        newarray.push(element);
      }
    });
    this.setState({
      dataSource:newarray,
      office:officetype
    });
  }
  
  filterOfficeTypePitt = () =&gt; {
    this.filterOfficeType("pitt");
  }
  filterOfficeTypeAtl = () =&gt; {
    this.filterOfficeType("atl");
  }
  </code></pre>