CODEWITHSUNDEEP
javascriptreact-native
Alessandro Macanha
Alessandro Macanha

Reputation: 711

React Native ListView dataSource allways null

I have this piece of code 

  componentWillMount() {
    return fetch("http://10.0.3.2:8080/all", {
        method: "GET",
        headers: {
            Accept: "application/json",
            "Content-Type": "application/json"
        }
    })
        .then(response => response.json())
        .then(responseData => {
            this.ds = new ListView.DataSource({
                rowHasChanged: (r1, r2) => r1 !== r2
            });
            this.setState({
                dataSource: this.ds.cloneWithRows(responseData)
            });
        })
        .catch(error => {
            console.log("error : " + error);
        });
};

It brings me the data from my api, i already test it with console.log(this.state.dataSource) and the result was console.log result

But when i add the code

<ListView
    dataSource={this.state.dataSource}
    renderRow={(rowData, navi) => this.renderEvent(rowData, this.props.nav)}
/>

I receive this error Error

Upvotes: 1

Views: 199

Answers (1)

Ryan Turnbull
Ryan Turnbull

Reputation: 3944

Is this issue fixed by adding a simple constructor to your main component? I'd imagine you are getting this issue because you haven't received the data yet at the time of your initial render. Something like

class Test extends Component{
    constructor(props){
        super(props);

        this.state = {
            dataSource = [];
        }
   }

So when you have your ListView , atleast it will have something to pull from initially.

Hope this helps, but if not, have a look at this article , explains this concept further in depth.

Upvotes: 1

Related Questions