Не могу понять, почему так происходит. Если я рандомно генерирую места в массиве parkingPlaces (закоментированный код) и, следовательно, в методе getPlacesFromDb не копирую полученный из firebase массив в массив parkingPlace, то все работает. Как только я делаю так, как в приведенном ниже коде, то получаю ошибку Cannot read property 'status' of undefined. Сначала я подумал, что не успевают данные с firebase подгрузиться и поэтому выдает ошибку, т.к. массив пустой. Поставил async, await. И ошибка та же. В чем может быть проблема?
async created() {
/* for (let i = 1; i <= 65; i++) {
let place = {
id: i,
status: Math.random() >= 0.5,
}
// Добавить
this.parkingPlaces.push(place)
} */
await this.getPlacesFromDb()
},
data() {
return {
name: '',
phone: '',
bookingDialog: false,
placeNumber: null,
bookingValid: false,
parkingPlaces: [],
receivedPlaces: [],
}
},
methods: {
getStatus(id) {
const sta = this.parkingPlaces[id - 1].status ? 'busy' : 'free'
//console.log("Парковка № ", id, " состояние: ", sta)
return sta
},
bookingPlace(id) {
console.log('Booking place ', id)
if (!this.parkingPlaces[id - 1].status) {
this.placeNumber = id
this.bookingDialog = true
}
},
changePlaceStatus(id) {
this.parkingPlaces[this.placeNumber - 1].status = true
let formData = {
name: this.name,
phone: this.phone,
id: this.placeNumber,
}
console.log(formData)
// Reset
this.bookingDialog = false
this.placeNumber = null
this.name = ''
this.phone = ''
},
getPlacesFromDb() {
let getPlaces = this.$fireDb.ref()
const receivedPlacesArray = []
getPlaces.on(
'value',
function (snapshot) {
const receivedPlaces = snapshot.val()
receivedPlaces.forEach((el) => {
let item = {
id: el.id,
status: el.status,
}
receivedPlacesArray.push(item)
})
},
function (error) {
console.log('Error: ' + error.code)
}
)
this.parkingPlaces = [...receivedPlacesArray]
},
},
async mounted() {
await this.getPlacesFromDb()
},
mounted
и вcreated
вызываетеgetPlacesFromDb
? Почему бы не в одном месте. Например вmounted
.