React Native cloneWithRows error - object undefined

Question

I'm quite new to the framework. I'm making a basic ListView with dataSource in React-Native, with data that I fetch.

constructor(props){
    super(props);
    var dataSource = new ListView.DataSource({
        rowHasChanged: (r1, r2) => r1 !== r2,
    });
    this.state = {
        searchString: '',
        isLoading: false,
        message: '',
        jsonData: '',
    };
}


_fetchData(query){

    console.log(query);
    this.setState({ isLoading: true });

    fetch(query)
        .then(response => response.json())
        .then(responseData => {
            this._handleResponse(responseData);
            this.setState({
                message: 'seems like it worked!',
                dataSource: this.state.dataSource.cloneWithRows( responseData ),
            });
        })
        .catch(error => 
            this.setState({
                isLoading: false,
                message: this.state.message + ' --- ' + 'Something bad happened' + error
            })
        ).done(); 

}

the data I fetch is an extract from a twitter API response:

{  "statuses": [
{
  "coordinates": null,
  "favorited": false,
  "truncated": false,
  "created_at": "Mon Sep 24 03:35:21 +0000 2012",
  "id_str": "250075927172759552",
  "retweet_count": 0,
  "in_reply_to_status_id_str": null,
  "id": 250075927172759552
}
]}

yet, I get a "undefined is not an object (evaluating 'dataSource.rowIdentities')" error on cloneWithRows. This error appears when I run the simulation on iOS 8.4 and 9.1. I'm probably missing something small and have been stuck for hours. Any ideas?

Rajeesh · Accepted Answer · 2015-10-31 17:22:22Z

3

Looking at the code, I guess you want show the statuses inside listview. For that change your code to this.state.dataSource.cloneWithRows(responseData.statuses)

ListViewDataSource source code has detailed comment which explains the format this function is expecting https://github.com/facebook/react-native/blob/62e8ddc20561a39c3c839ab9f83c95493df117c0/Libraries/CustomComponents/ListView/ListViewDataSource.js#L95-L110

Update:

Set the dataSource property on state object, change your code in the constructor to

this.state = { searchString: '', isLoading: false, message: '', jsonData: '', dataSource: dataSource };

edited Oct 31, 2015 at 17:22

answered Oct 26, 2015 at 4:49

Rajeesh

4,5154 gold badges28 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

engineer7 Over a year ago

Tried that as well. I get back 'TypeError: cannot read property 'cloneWithRows' of undefined' ...

Rajeesh Over a year ago

@EvgenyRoskach I have updated my answer, please check that will solve your issue

engineer7 Over a year ago

Thank you ! it worked. I modified the following way: this.state = { searchString: '', isLoading: false, message: '', dataSource: new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2, }), };

Rajeesh Over a year ago

@EvgenyRoskach Glad that it worked for you, please don't for to accept my answer

Collectives™ on Stack Overflow

React Native cloneWithRows error - object undefined

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related