title: How to call function from another file in react native?
body: <p>I have api.js where i am writing logic of service call and home.js where i want to show data getting from API. But i am getting difficulty of how to call function in home.js and get data from api.js class.</p>
  
  <p>api.js</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import axios from 'axios';
  import * as myConstant from '../common/Constants';
  
  export default async function fetchInfo() {
      axios
        .get(myConstant.API + 'albums', {timeout: myConstant.TIMEOUT} )
        .then((response) =&gt; {
          const items = response.data.items;
          return items;
        })
        .catch(err =&gt; {
          this.setState({isLoading: false, apiLoadingError: true})
        }); 
    }</code></pre>
  </div>
  </div>
  </p>
  
  <p>home.js </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, { Component } from 'react';
  import { ActivityIndicator } from 'react-native-paper';
  import {
     Text, View, TouchableOpacity, FlatList
  } from 'react-native';
  import { Ionicons } from '@expo/vector-icons';
  import axios from 'axios';
  import styles from '../style/Home.component.style';
  import ErrorAlert from '../common/ErrorAlert';
  import * as myConstant from '../common/Constants';
  import fetchInfo from '../component/API';
  
  
  export default class HomeScreen extends Component {
  
      // For to Navigation header
      static navigationOptions = () =&gt; ({
        headerTitle: 'Album List',
      });
  
      constructor(props) {
        super(props);
  
        this.state = {
          isLoading: true,
          apiLoadingError: false,
          items: []
  
        };
      }
  
    
      async componentDidMount() {
        **await fetchInfo().then((items) =&gt; this.setState({ items }));** NOT working for me ... how to get data here
  
      }
  
      FlatListItemSeparator = () =&gt; (
          &lt;View style={styles.flatListItemSeparator} /&gt;
      )
  
      render() {
        if (this.state.isLoading) {
          return (
            &lt;View style={{ flex: 1, paddingTop: 30 }}&gt;
                &lt;ActivityIndicator animating={true} size='large' /&gt;
            &lt;/View&gt;
          );
        }
  
        if (this.state.apiLoadingError) {
          return (
            &lt;ErrorAlert /&gt;
          );
        }
  
        return (
  
          
          &lt;View style={styles.MainContainer} &gt;
            
            &lt;FlatList
                data={ this.state.items  } 
                testID='AlbumList'
                ItemSeparatorComponent = {this.FlatListItemSeparator}
                renderItem={({ item }) =&gt; &lt;View style={styles.listRowContainer}&gt;
  
                    &lt;TouchableOpacity onPress={() =&gt; this.props.navigation.navigate('ThumbnailViewScreen', {
                      albumID: item.id,
                    })} style={styles.listRow}&gt;
                    &lt;View style={styles.listTextNavVIew}&gt;
                      &lt;Text style={styles.albumTitle}&gt; {console.log(fetchInfo().then((items) =&gt; this.setState({ items })))} &lt;/Text&gt;
                      &lt;Ionicons name='md-arrow-dropright' style={styles.detailArrow} /&gt;
                    &lt;/View&gt;
                    &lt;/TouchableOpacity&gt;
  
                &lt;/View&gt;
              }
                keyExtractor = { (item, index) =&gt; index.toString() }
            /&gt;
          &lt;/View&gt;
        );
      }
  }</code></pre>
  </div>
  </div>
  </p>