title: react native native base list item blank
body: <p>I try to create list item based on native base,
  I already read <a href="http://nativebase.io/docs/v0.5.0/components#dynamicList" rel="nofollow noreferrer">this document</a> and <a href="https://reactnativecode.com/custom-json-listview-images-text-api-android-ios/" rel="nofollow noreferrer">this document</a></p>
  
  <p>Unfortunately all those method does not work.  I believe there something wrong with my code since I'm new to react work</p>
  
  <p>I got blank when I run my code.  Here is my code. 
   Please give some suggestion to fix my error.</p>
  
  <pre><code>import React from 'react';
  import {ListView} from 'react-native';
  
  import { Container, Content, Card, CardItem, Button,  Body,  Text, List, ListItem} from 'native-base';
  import {create} from 'apisauce';
  
  import {  AppLoading } from 'expo';
  
  
  let ds = new ListView.DataSource({rowHasChanged: (r1, r2) =&gt; r1 !== r2});
  
  class UserList extends React.Component {
  
  
  state = {
          apiAreLoaded: false,
          dataSource: ds
  };
  
  
  constructor() {
      super();
  
  
  
  }
  
  async componentDidMount() {
  
  
  
      // define the api
      const api = create({
          baseURL: 'https://reqres.in/',
          headers: {
          Accept: 'application/json'
          }
      })
  
      // start making calls
      //api.get('/api/users?page=2').then((response) =&gt; response.data).then(console.log);
  
      //use async
      const response = await api.get('/api/users?page=2');  
      console.log(response.data.data);  
      this.setState({ apiAreLoaded: true });
  
  
      this.setState = {
          dataSource: ds.cloneWithRows(response.data.data),
          };
  
      // console.log(this.state.dataSource);
  
  
  
  
  }
  
  render() {
  
  
  
  
      if(!this.state.apiAreLoaded)
      {
          return  &lt;AppLoading /&gt;;
  
      }
  
  
  
      return(
          &lt;Container&gt;
              &lt;Content&gt;
                  &lt;List dataObject={this.state.dataSource}
                  renderRow={(item) =&gt;
                      &lt;ListItem&gt;
                          &lt;Text&gt;{item.avatar}&lt;/Text&gt;
                      &lt;/ListItem&gt;
                  }&gt;
                  &lt;/List&gt;
              &lt;/Content&gt;
              &lt;/Container&gt;
  
          // &lt;ListView
          // dataSource={this.state.dataSource}
          // renderRow={(rowData) =&gt;   
          //     &lt;Card&gt;
          //         &lt;CardItem header&gt;
          //         &lt;Text&gt; {rowData.avatar}&lt;/Text&gt;
          //         &lt;/CardItem&gt;
          //         &lt;CardItem&gt;
          //         &lt;Body&gt;
          //             &lt;Text&gt;
          //             {rowData.first_name}
          //             &lt;/Text&gt;
          //         &lt;/Body&gt;
          //         &lt;/CardItem&gt;
          //         &lt;CardItem footer&gt;
          //         &lt;Text&gt;{rowData.avatar}&lt;/Text&gt;
          //         &lt;/CardItem&gt;
          //     &lt;/Card&gt;
  
  
          // }
          // /&gt;
  
      );
  
  }
  
  
  }
  
  
  
  export {UserList};
  </code></pre>
  
  <p>thanks mate.</p>