페이지 새로고침 후 데이터가 사라짐 - vuexfire

페이지 새로고침 후 데이터가 사라짐 - vuexfire

안녕하세요 여러분 저는 다음과 같은 문제가 있습니다.나는 vuexfire를 쓴다.firestore에서 데이터를 바인드하면 나타나며 페이지를 새로고침하거나 다른 페이지를 방문했다가 돌아오면 데이터가 사라집니다.이 문제와 해결 방법을 아는 사람이 있습니까?

코드는 다음과 같습니다.

main.discloss.main.discloss.

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

// fontawesome
import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { faUserSecret, faHome, faSignInAlt, faDumbbell, faUserGraduate, faInfoCircle } from '@fortawesome/free-solid-svg-icons'
library.add(faUserSecret, faHome, faSignInAlt, faDumbbell, faUserGraduate, faInfoCircle)

const app = createApp(App)
app.component('fa-icon', FontAwesomeIcon)

app.config.productionTip = false
app.config.devtools = true

app.use(store).use(router).mount('#app')

store/index.displaces

import { createStore } from 'vuex'
import { vuexfireMutations, firestoreAction } from 'vuexfire'
import { db } from '@/db' 

export default createStore({
  state: {
    todos: []
  },

  mutations: {
    ...vuexfireMutations,
  },

  actions: {
    bindTodosRef: firestoreAction(context => {
      return context.bindFirestoreRef('todos', db.collection('todos'))
    }),
},

  getters: {},
  modules: {},

})

Home.vue

<template>
  <div class="home">
    <h1>Home</h1>
    
    {{ todos }}
  
  </div>
</template>

<script>
import { mapState, mapActions, mapGetters } from 'vuex'
import { db } from '@/db'

export default {
  name: 'Home',
  methods: {
    
  },

  computed: mapState(['todos']),
  
  created() {
    this.$store.dispatch('bindTodosRef', { ref: db.collection('todos') })
  },
}
</script>

많이!

언급URL : https://stackoverflow.com/questions/65243676/data-disappears-after-page-is-reloaded-vuexfire