Получение имен документов в Firestore Collection для отображения в качестве параметров в Select Input

Question

Я пытаюсь создать приложение, которое позволит пользователям регистрироваться на турнир, в котором параметры турнира выбираются из коллекции пожарного магазина, а их имя отображается в выпадающем списке. В настоящее время я могу видеть, сколько турниров доступно в раскрывающемся списке, но они просто говорят «неопределенное» вместо названия. Если это помогает для этой формы, я забочусь только о названии турнира, мне не нужны все остальные атрибуты, которые отображаются. Изображение, показывающее раскрывающийся список, когда в коллекции базы данных есть два элемента Изображение, показывающее, как настроена база данных Firestore

  componentDidMount() {
    let tournaments = this.db
      .collection("tournaments")
      .get()
      .then(querySnapshot => {
        tournaments = querySnapshot.docs.map(doc => doc.data());
        this.setState({ tournaments });
        this.tournamentChoices();
      });
  }

  tournamentChoices() {
    var select = document.getElementById("select");
    for (var i = 0; i < this.state.tournaments.length; i++) {
      var option = document.createElement("OPTION"),
        txt = document.createTextNode(this.state.tournaments[i].name);
      option.appendChild(txt);
      option.setAttribute("value", this.state.tournaments[i].name);
      select.insertBefore(option, select.lastChild);
    }
  }

  <FormGroup>
    <Input type="select" id="select" onChange={this.handleTournament}>
        <option value="default">Select Tournament</option>
    </Input>
</FormGroup>

Answer 1

Я исправил это. Проблема была в том, как я хранил турниры при добавлении в БД из моего приложения. Я настроил его неправильно, поэтому турниры были вложены в одноименный турнир без каких-либо других атрибутов. Спасибо за помощь.

this.db.collection('tournaments').doc(this.state.name).set(
            tournament //originally this was {tournament} so was passing in an object not the values
        );
    };