Populate dropdown fields with firebase data

Question

I am getting values in console but not able to show in drop down See this link

Can anybody explain what im doing wrong here

        return firebase.database().ref('Users/Trainers/').on('value', (snapshot) => {
            snapshot.forEach(function(childSnapshot){
                // var childKey= childSnapshot.key;
                var childData= childSnapshot.val();
                var childEmail = childData.email;
                var childfirstName = childData.firstName;
                var childlastName = childData.lastName;
                var childTrainers = childfirstName + ' ' + childlastName + ' ' + childEmail;
            console.log(childTrainers);
            })
        })
    }

    async componentDidMount(){
        this.getlist();
    }

State

childTrainers: []

And in render method,

<Select options={this.state.childTrainers} />

Where do you call `setState` with the updated childTrainers ? — Draeken, Feb 06 '20 at 12:42
Thats what ive done mistake.. `this.setState({ CourseName : [{label: {CName}}] })` If doing so, im getting error — , Feb 06 '20 at 13:07
See https://stackoverflow.com/questions/59871401/how-to-update-firebase-data-to-the-react-application-in-realtime/59871491#59871491 for a minimal example of how to load data from Firebase, set it to the state, and render it from there. — Frank van Puffelen, Feb 06 '20 at 14:59

score 1 · Answer 1 · answered Feb 06 '20 at 13:43

1

Try updating the state when fetching values from firebase:

return firebase.database().ref('Users/Trainers/').on('value', (snapshot) => {
    const childTrainerSnapshot = snapshot.map(childSnapshot => {
        return childfirstName + ' ' + childlastName + ' ' + childEmail
    });
    this.setState({ childTrainers: childTrainerSnapshot });
})

answered Feb 06 '20 at 13:43

Draeken

380
3
7

Nopes, this is not working for me – Feb 07 '20 at 05:14

Populate dropdown fields with firebase data

1 Answers1