title: React navigation params doesn't reset?
body: <p>I have filter screen and search screen. When user navigates from search screen I am passing search term from search screen to Home screen. Similarly I am doing samething for filter screen (passing filterOptions from filter screen to Home screen).</p>
  
  <p>Now when I come from filter screen to home screen I want to set searchTerm to null and similarly if I am coming from search screen to home screen I want to set filterOptions to null how can I do that ?</p>
  
  <p>In below code Line A and Line B doesn't set <code>filterOptions</code> and <code>searchTerm</code> to null thats why filter and search is not working because when filterOptions is not null I want searchTerm to be null that means only filter should work at that instance. Similarly if filterOptions is null then searchTerm must not be null that means only search should work at that instance.</p>
  
  <p>Code: </p>
  
  <pre><code>filterProjectResults = (projects) =&gt; {
  
        let filterOptions = this.props.navigation.getParam('filterOptions', null);
        let searchTerm = this.props.navigation.getParam('searchTerm', null);
  
        console.log('Initial filterOptions ', filterOptions);  --&gt; initially null
        console.log('intital searchTerm ', searchTerm); --&gt; initially null
  
  
        if(filterOptions !== null){ 
          console.log('Inisde filter screen ', filterOptions)
          let display_filtered_projects = projects.filter((item) =&gt; item.floorplans.some(val =&gt; filterOptions.includes(val.bhk)));
          searchTerm = null;  &lt;--- Line A
          return display_filtered_projects;
  
        } else if (searchTerm !== null) {
          console.log('Inside Search screen ', searchTerm);
          let search_filter_projects = projects.filter(
            (project) =&gt; {
              return project.name.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1
            }
          );
          filterOptions = null;   &lt;&lt;--- Line B
          return search_filter_projects;
  
        }
  
    }
  </code></pre>
  
  <p>search.js:</p>
  
  <pre><code>&lt;TouchableOpacity onPress={() =&gt; this.props.navigation.navigate('Projects', {searchTerm : this.state.text})}&gt;
      &lt;Image source={require('../../assets/images/search.png')} style={{width: 24, height: 24, resizeMode: 'contain'}}/&gt;
  &lt;/TouchableOpacity&gt;
  </code></pre>
  
  <p>filter.js:</p>
  
  <pre><code>&lt;TouchableOpacity onPress={() =&gt; this.props.navigation.navigate('Projects', {filterOptions: this.state.filterOptions})}&gt;
      &lt;View style={styles.filterButton}&gt;
          &lt;Text style={styles.filterButtonText}&gt;Apply Filters&lt;/Text&gt;
      &lt;/View&gt;
  &lt;/TouchableOpacity&gt;
  </code></pre>
  
  <p>I am passing this filtered or searched data inside Flatlist to display the results. If I try to implement it using state I get error -> <a href="https://imgur.com/a/P4vyRsu" rel="nofollow noreferrer">https://imgur.com/a/P4vyRsu</a> code: <a href="https://gist.github.com/aditodkar/1df0175e2b13727daaae0373040f8dcf" rel="nofollow noreferrer">https://gist.github.com/aditodkar/1df0175e2b13727daaae0373040f8dcf</a></p>