я продолжаю это приложение Чтение данных из базы данных в vuex . Я застрял, когда хочу открыть страницу с информацией о событии. До сих пор я мог это сделать, когда в первый раз, когда я щелкаю по событию, он открывает страницу сведений о событии, в котором произошла ошибка с консолью, но когда я перезагружаю страницу сведений, он не перезагружает данные.
Это мой магазин. js
state:{
events:[],
},
mutations:{
setEvent(state,payload){
state.events = payload
},
setEventDetails(state,payload){
state.events = payload
},
},
actions:{
addEvent(context,payload){
firebase.database().ref('eventos/').push(payload)
.then((event)=>{
context.commit('setEvent',event)
}).catch(err =>{
console.log(err)
})
},
getEvents({commit}){
let events = [];
firebase.database().ref('eventos')
.on('value',event =>{
event.forEach(data =>{
events.push({ "id": data.key, ...data.val() })
});
commit('setEvent',events)
});
},
getEventDetails(context,payload){
let event = context.getters.eventDetails(payload.id);
context.commit('setEventDetails',event)
}
},
getters:{
eventDetails: (state) => (id) => {
return state.events.find((event) => event.id === id);
},
eventList: state => {
return state.events
},
}
Это мои ReadEvents. vue, откуда я нажимаю, чтобы открыть страницу с подробной информацией о событии.
<template>
<div>
<div v-for="(event,id) in eventList" :key="id">
{{event}}
<button v-on:click="openEventDetails(event.id)">Details</button>
</div>
</div>
</template>
<script>
export default {
name: "ReadEvents",
computed:{
eventList(){
return this.$store.getters.eventList;
}
},
mounted() {
this.$store.dispatch('getEvents')
},
methods:{
openEventDetails(id){
this.$router.push({
name: 'Detalles',
params:{id:id}
})
}
}
И это EventDetails. vue, где отображаются детали события.
<template>
<div>
{{search}}
</div>
</template>
<script>
export default {
props:['id'],
name: "EventDetails",
computed:{
search() {
return this.$store.getters.eventDetails(this.id)
},
},
created() {
console.log(this.search)
},
mounted() {
this.$store.dispatch('getEventDetails')
},
}
Вот результат, когда я открываю из ReadEvents. vue 
И это если после перезагрузки страницы
2 :