Пытаетесь запросить firebase, используя where array-contains, как дождаться получения данных? - PullRequest
Новая
       97

Пытаетесь запросить firebase, используя where array-contains, как дождаться получения данных?

0 голосов
/ 18 июня 2020

Я использую VueJS в моем первом реальном проекте webdev, и у меня возникли проблемы при попытке запросить firestore Firebase. Я использую плагин VueFire для Vue FYI. У меня есть пользователи в коллекции «Пациенты» в firebase, и я могу получить доступ к этому списку пациентов, используя следующий запрос: 

const db = firebase.firestore();

export default {
  ...
  data () {
    return {
      email: firebase.auth().currentUser.email,
      therapistData: [],
      patientsList: []
    }
  },
  firestore () {
    return {
      therapistData: db.collection('Therapist').doc(this.email),
      patientsList: db.collection('Patient').where('practiceName', 'array-contains', 'TestPractice')
  }
}

Каждый пациент содержит массив PracticeName, а каждый терапевт содержит строку PracticeName. PatientList должен предоставить мне объект, содержащий каждого пациента в коллекции Patient, где их массив PracticeName содержит имя практики, зарегистрированного в данный момент пользователя (Therapist).

При жестком кодировании в строке, такой как 'TestPractice' в моем запросе where список пациентов заполняется, как ожидалось, и я могу отобразить его, используя следующий код vue: 

<div v-for="(userItem, idx) in patientsList) :key="idx">
  <p>{{ patientsList[idx].firstName }} {{ patientsList[idx].lastName }}</p>
</div>

Итак, этот код работает правильно. Моя проблема в том, что я пытаюсь динамически (на основе зарегистрированного терапевта) вытащить значение PracticeName и передать его в качестве третьего аргумента моему списку пациентов, где query. Таким образом, он должен читать: 

patientsList: db.collection('Patient').where('practiceName', 'array-contains', this.therapistData.practiceName)

Когда я сохраняю этот код, появляется сообщение об ошибке, в котором говорится, что where () ожидает допустимый третий аргумент и получил «undefined». Почему это не определено? Когда я визуализирую vue {{ therapistData.practiceName }} или 

<button @click="patientsList(therapistData.practiceName)">Test method</button>
...
methods: {
  patientsList: function(practice) {
    console.log('Practice: ' + practice)
  }
}

, я вижу правильное значение therapistData.practiceName print в консоли. Может ли кто-нибудь помочь мне понять или исправить эту проблему? Почему PracticeName отображается как undefined при попытке использовать его в моем запросе where ()?

1 Ответ

0 голосов
/ 19 июня 2020

Может нужно сделать программки c привязка 

export default {
  data() {
    return {
      therapistData: [],
    }
  },

  watch: {
    therapistData: {
      // call it upon creation too
      immediate: true,
      handler(therapistData) {
        this.$bind('practiseName', therapistData.practiseName)
      },
    },
  },
}
...