CODEWITHSUNDEEP
androidreact-nativereactjs
Vadim
Vadim

Reputation: 68

React Native fetch from db-models

I am trying to fetch from db-models to ListView. Here is my code:

export default class todoDB extends Component {
constructor(props) {
    super(props);
    this.state = {
        dataSource : new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2})
    };

}
componentDidMount () {
    this.fetchData();

}
fetchData () {
    DB.users.get_all(function(result) {
        let data = [];
        for(let i = 1; i <= result.totalrows; i++) {
            data.push(result.rows[i]);
        }
        this.setState({
            dataSource: dataSource.cloneWithRows(data),

        })

    });

}
render () {
    return (
        <ListView
            dataSource={this.state.dataSource}
            renderRow={this.renderList}
            />
    );
}
renderList (item) {
    return (
        <View>
            <Text>{item.age}</Text>
        </View>
    );
}};

After running I don`t have error or any output, only empty screen. I using

Upvotes: 1

Views: 338

Answers (1)

Kevin Amiranoff
Kevin Amiranoff

Reputation: 14468

I have not tested it but you could try this :

  fetchData() {
    DB.users.get_all((result) => {
      let data = [];
      for (let i = 1; i <= result.totalrows; i++) {
        data.push(result.rows[i]);
      }
      this.setState((prevState) => (
      {
        dataSource: prevState.dataSource.cloneWithRows(data)
      }));

    });
  }

Changes are : using arrow function instead of function(result) to keep the scope of this and updating the previous state prevState.dataSource.cloneWithRows(data) (in your code dataSource was undefined here)

As to why use prevState, it is to keep immutability. Little bit more info here : https://facebook.github.io/react/docs/react-component.html#setstate

Upvotes: 3

Related Questions