Я хочу отобразить весь список пользователей по запросу firestore. Но я застрял в цепочке обещаний. Чтобы запросить документы коллекции, необходимы два асинхронных шага. Как я могу дождаться заполнения всего списка.
Вот мой код. Я надеюсь, что мой fetchUsers() заполнит массив без цепочки обратных вызовов.
const db = firebase.firestore();
export default {
data: () => {
return {
users: [],
}
},
mounted: function() {
this.fetchUsers()
console.info('mounted, users:', this.users) // // => at this point, this.users is not yet ready.
},
computed: {
items: function() {
return this.users
}
},
methods: {
async fetchUsers () {
await db.collection('users').get()
.then(snapshot => {
snapshot.forEach( doc => {
const user = doc.data()
console.info('forEarch:' , user)
user.id = doc.id
this.users.push(user)
})
})
.catch(error => {
console.error(error)
})
console.debug('fetchUser return: ', this.users) // => at this point, this.users is not yet ready.
},



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Не смешивайте синтаксис async/await с then/catch
const query = db.collection('users')
async fetchUsers () {
try {
const { docs } = await query.get()
this.users = docs.map(doc => {
const { id } = doc
const data = doc.data()
return { id, ...data }
})
console.info('Loaded users', this.users)
} catch (error) { throw new Error('Something gone wrong!') }
}
this.fetchUsers().then(() => { console.info('mounted, users:', this.users) })ВашfetchUsersметодasyncтак что простоreturn a promise