title: Passing state from parent component to child function
body: <p>I am a bit lost when it comes to passing a state from a component to a function. I have successfully passed a state from Home into ListHome(A component being imported and rendered into Home) but I am struggling to continue passing it to a function that is being rendered in ListHome(Slider). Mainly due to it being a function.</p>
  <p>I have looked over the docs again but am still struggling to understand how this should work. A direct edit/example would be super helpful!</p>
  <p>I am rendering Home in a stack in App.js. If you wish for me to include this file just let me know.</p>
  <p>I appreciate any insight at all more than you know.</p>
  <p>Home.js</p>
  <pre><code>export default class Home extends React.Component {
   
    constructor(props) {
      super(props)
      this.state ={
        visible: true,
        whichComponentToShow: 'Screen1'
      };
  }
  
  goToMap = () =&gt; {
    this.setState({whichComponentToShow: 'Screen2'})
  }
  goToList = () =&gt; {
    this.setState({whichComponentToShow: 'Screen1'})
  }
  
    render(){
       if(this.state.whichComponentToShow === 'Screen1'){
        return(
         &lt;View style={{backgroundColor: '#d1cfcf' ,flex: 1}}&gt;
          &lt;ListHome
            renderMap = {this.goToMap.bind(this)}
            renderList = {this.goToList.bind(this)}
          /&gt;
  </code></pre>
  <p>ListHome.js</p>
  <pre><code>export default class ListHome extends React.Component {
    
    goToMap = () =&gt; {
      this.props.renderMap();
    }
  
    goToList = () =&gt; {
      this.props.renderList();
    }
  
  render() {
    return (
  
       &lt;Slider
           renderMap = {this.goToMap.bind(this)}
           renderList = {this.goToList.bind(this)}
       /&gt;
  </code></pre>
  <p>Slider.js(I have not implemented anything into this file in attempt to pass the state yet)</p>
  <pre><code>const Slider = (props) =&gt; {
    
    const [active, setActive] = useState(false)
    let transformX = useRef(new Animated.Value(0)).current;
  
    //animation code I removed that uses the above const and let
  
  
    return (
      //code I removed that just creates a button. 
      //The touchable opacity is how I want to use the state.
      &lt;TouchableOpacity onPress={() =&gt; this.goToMap}&gt;
  
      &lt;/TouchableOpacity&gt;
    );
  }
  
  
  export default Slider
  </code></pre>