Return data to component from DB helper class react native

Question

I am using sqlite and I have created a db helper class. I am not getting the data from that class inside component, but if I am consoling inside db helper it is working right, but not in component. I am giving my code:-

Cartdb.js . (Helper class)

var SQLite = require('react-native-sqlite-storage')
db = SQLite.openDatabase('predefine.db', "1.0", "Predefine", -1);
class CartDB {
    constructor(){

    }
    totalItems = 0;
    checkCountOfProduct(){
        query = "SELECT SUM(count) AS product_count FROM Predefinedcart";
       db.transaction((tx) => {
            tx.executeSql(query, [], (tx, results) => {
                console.log(results.rows.item(0).product_count)
                this.totalItems = results.rows.item(0).product_count;
                return this.totalItems;
            }, function (tx, error) {
                console.log('SELECT error: ' + error.message);
            });
        })
    }
}

export default new CartDB();

Code in Component:

import CartDB from '../../../library/CartDB';
class PredefinedLayout extends React.Component{
 constructor(props){
   super(props);
   console.log(CartDB.checkCountOfProduct());
 }


}

How can I get data here? Thanks in advance.

parohy · Accepted Answer · 2018-11-12 08:39:35Z

Its an async operation, which means it is a promise. Best way would be to pass a callback to the function or return the db operation as promise and chain then. Some documentation on Promises in javascript is here.

With callback:

class CartDB {
constructor(){

}
totalItems = 0;
checkCountOfProduct(callback){
    query = "SELECT SUM(count) AS product_count FROM Predefinedcart";
   db.transaction((tx) => {
        tx.executeSql(query, [], (tx, results) => {
            console.log(results.rows.item(0).product_count)
            this.totalItems = results.rows.item(0).product_count;
            callback(this.totalItems)
        }, function (tx, error) {
            console.log('SELECT error: ' + error.message);
        });
    })
}
}

and in Comp you call: CartDB.checkCountOfProduct(count => console.log(count));

With promise:

class CartDB {
constructor(){

}
totalItems = 0;
checkCountOfProduct(){
    query = "SELECT SUM(count) AS product_count FROM Predefinedcart";
   return new Promise((resolve, reject) => db.transaction((tx) => {
        tx.executeSql(query, [], (tx, results) => {
            console.log(results.rows.item(0).product_count)
            this.totalItems = results.rows.item(0).product_count;
            resolve(this.totalItems);
        }, function (tx, error) {
            reject(error);
        });
    }))
}
}

and in Comp you call: CartDB.checkCountOfProduct().then(count => console.log(count));

Collectives™ on Stack Overflow

Return data to component from DB helper class react native

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related