Can't get data from firebase

user_11245102 0
Viewed 67

I can't get data from firebase. Firebase.js is using for initialization of firebase and in App.js I am trying to get and work with it. Now when I'm trying to get data and display it in browser, I see just blank page. Looks like I didn't get any data. In some reasons I even can't console.log from stocksRef.on('value', (dataSnapshot) and I can't check what data I got and did I get it. Please, help me to fix it.

App.js

class StocksList extends Component {
    constructor(props){
        super(props);
        this.state = {
            stocks: []
        }
    }

    componentDidMount() {
        const stocksRef = firebase.database().ref('list');
        console.log('popopok', stocksRef)
        stocksRef.on('value', (dataSnapshot) => {
            let list = dataSnapshot.val();
            this.setState({
                stocks: Object.values(list)
            })
        })
    }

    render() {
        return (
            <div>
                {this.state.stocks.map((item) => {
                    return (
                        <div>
                            <p>ISIN: {item.isin}</p>
                            <p>issuer: {item.issuer}</p>
                            <p>issuerCode: {item.issuerCode}</p>
                            <p>ISIN: {item.isin}</p>
                            <p>nominal: {item.nominal} {item.currency}</p>
                            <p>form: {item.form}</p>
                            <p>vyd: {item.vyd}</p>
                        </div>
                    )
                })}
            </div>

        )
    }
}

export default StocksList;

firebase.js

import firebase from 'firebase'

let config = {
    apiKey: ******,
    authDomain: ******,
    databaseURL: ******,
    projectId: ******,
    storageBucket: ******,
    messagingSenderId: ******,
    appId: ******
};

firebase.initializeApp(config);

export default firebase;
firebase reactjs javascript
2 Answers

You need to make access permission rules at firebase console.

As far as I know you need to make some rules for Access data in firebase real-time-database.
And If you want to know about firebase permission rule, just read my reference

You can check it with next code's error

try{
 stocksRef.on('value', (dataSnapshot) => {
            let list = dataSnapshot.val();
            this.setState({
                stocks: Object.values(list)
            })
        })
} catch(error) {
             console.log(error);
}

Reference

  1. Database rules - Firebase Documents
user_110402190

Try like this

async componentDidMount() {
        const stocksRef = await firebase.database().ref('list');
        console.log('popopok', stocksRef)
        stocksRef.on('value', (dataSnapshot) => {
            let list = dataSnapshot.val();
            this.setState({
                stocks: Object.values(list)
            })
        })
    }
user_15081470
Related