title: React-Native how to not run function when starting the app?
body: <p>I am currently learning how to create app using React Native and I am running into the issue of why is my app running the method when the app just started running? </p>
  
  <p>I thought that I am only calling the function componentDidMount() in my button onPress ? </p>
  
  <p>everything works fine as intended but I am just not sure why that's happening. </p>
  
  <p>Thanks for your help!</p>
  
  <pre><code>import React from 'react';
  import { StyleSheet, Text, View, TextInput, Button } from 'react-native';
  
  export default class App extends React.Component {
  
    constructor(props){
      super(props)
      this.state = {
        isLoading: true,
        text: ''
      }
    }
  
    componentDidMount(summonerIGN){
      console.log("This is in summonerIGN", summonerIGN)
        return fetch('https://na1.api.riotgames.com/lol/summoner/v3/summoners/by-name/' + summonerIGN +'?api_key=&lt;APIKey&gt;')
        .then((response) =&gt; response.json())
        .then((responseJson) =&gt; {
          console.log("This is in responseJson", responseJson)
          console.log("This is the summoner ID: ", responseJson.id)
          this.setState({
            isLoading: false,
            dataSource: responseJson,
            summonerID: responseJson.id,
            summonerName: responseJson.name,
          })
        })
        .catch((error) =&gt; {
          console.error(error)
        })
    }
  
    render() {
      return (
        &lt;View style={{padding: 10}}&gt;
          &lt;TextInput
            style={{height: 40}}
            placeholder="Search For Summoner!"
            onChangeText={(text) =&gt; this.setState({
              text: text
            })}
          /&gt;
          &lt;Button 
            onPress={() =&gt; {
              console.log("This is in this.state.text", this.state.text)
              this.componentDidMount(this.state.text)
            }}
            title="Search"
            color="#841584"
          /&gt;
          &lt;Text style={{padding: 10, fontSize: 20}}&gt;
            Searching for summoner: {this.state.text}
          &lt;/Text&gt;
          &lt;Text&gt;
            The summpner ID: {this.state.summonerID}
          &lt;/Text&gt;
        &lt;/View&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#fff',
      alignItems: 'center',
      justifyContent: 'center',
    },
  });
  </code></pre>