Error while rendering an array from firestore to react native

Question

i have an array that i am trying to read and store in a state however, with the code below, here is the error i get: "function collectionReferenace.doc() requires its first argument to be of type non-empty string, but it was undefined" any idea why this is happening and what is the solution?

componentDidMount(){
        dbh.collection('Groups').doc(this.props.route.params.groupName)
        .collection('Enrolled').doc('ids').get()
        .then(querySnapshot => {
            querySnapshot(doc => {
                this.setState({
                    playerIDs: doc.data().players
                })
            })
        })
        console.log(this.state.playerIDs)
    }

the this.props.route.params.groupName is passed from the navigation of the previous screen. When I set a constant in the render function to it and call that variable it works fine.

    render() {
    const groupName = this.props.route.params.groupTitle
return
<Text>{groupName}</Text>

for your reference, here is how i am getting that route.param

<GroupComponent onPress = {
() => this.props.navigation.navigate
('Attendance', {groupTitle: group.GroupName, groupID: group.id})
} />

The error means that the this.props.route.params.groupName is null (or undefined). Print out value of this.props.route.params.groupName just to check and tell me what it is. It will be undefined, what do you expect it to be and how do you get the value? — Nat
– Nat, Commented Jul 18, 2020 at 14:39
yes you are right. I have got undefined when i console logged it. — kerim Erkan
– kerim Erkan, Commented Jul 18, 2020 at 14:47
Okay, which means this.props.route.params.groupName is null. So how do you get that value and what do you expect it to be? Add the code to the question. — Nat
– Nat, Commented Jul 18, 2020 at 14:48
this.props.route.params.groupName has been passed through the navigate as it is the title of a selected group. — kerim Erkan
– kerim Erkan, Commented Jul 18, 2020 at 14:49
Add all the code relevant to that variable ( this.props.route.params.groupName) to your question, so I can see what's making it undefined please. Also try hard coding a value into .doc(this.props.route.params.groupName) and see if you get is what's expected. — Nat
– Nat, Commented Jul 18, 2020 at 14:49

RossHochwert · Accepted Answer · 2020-07-18 15:28:41Z

1

Based on your code, you should be acccessing dbh.collection('Groups').doc(this.props.route.params.groupTitle) not groupName. The object you pass through params has keys groupTitle and and groupID, not groupName.

answered Jul 18, 2020 at 15:28

RossHochwert

17010 bronze badges

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

Collectives™ on Stack Overflow

Error while rendering an array from firestore to react native

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related