Firebase Vuex:此.$store.dispatch不是一个函数

Firebase Vuex:此.$store.dispatch不是一个函数,firebase,vue.js,vuex,Firebase,Vue.js,Vuex,我正在尝试使用Vuex从firebase获取数据。我正在与firebase进行通信,将数据提交给突变,getter将从状态获取数据。然后我想在App.vue中显示状态数据 在App.vue组件中,我在mounted函数中编写了dispatch,并尝试从Vuex获取数据。然而,我得到了错误“TypeError:this.$store.dispatch不是一个函数”,当我检查状态时,它表示未定义。我的行为和突变写对了吗?为什么我会犯这样的错误 store.js import Vue from 'vu

我正在尝试使用Vuex从firebase获取数据。我正在与firebase进行通信,将数据提交给突变,getter将从状态获取数据。然后我想在App.vue中显示状态数据

在App.vue组件中,我在mounted函数中编写了dispatch,并尝试从Vuex获取数据。然而,我得到了错误
“TypeError:this.$store.dispatch不是一个函数”
,当我检查状态时,它表示未定义。我的行为和突变写对了吗?为什么我会犯这样的错误

store.js
import Vue from 'vue';
import Vuex from 'vuex';
import firebase from 'firebase';

Vue.use(Vuex);

export default new Vuex.mapState({
    state: {
        notebooks: [],
    },
    getters: {
        getItems: (state) => {
            return state.notebooks;
        },
    },
    mutations: {
        setItems: function(state, notebooks) {
            state.notebooks = notebooks;
        },
    },
    actions: {
        async getTodos({ commit }) {
            var notebooksRef = await firebase.firestore().collection('notebooks');
            const notebookList = [];
            notebooksRef.onSnapshot((snap) => {
                snap.forEach((doc) => {
                    let notebooks = {
                        id: doc.id,
                        notebook: doc.data(),
                    };
                    notebookList.push(notebooks);
                });
                commit('setItems', notebookList);
            });
        },
    },
});


Store.js
文件中尝试导出默认的新Vuex.Store({。

Store.js
文件中尝试导出默认的新Vuex.Store({)

App.vue
<template>
    <div id="app"></div>
</template>

<script>
export default {
    name: 'App',
    computed: {
        notebooks: function() {         
            return this.$store.state.notebooks;
        },
    },
    mounted() {
        this.$store.dispatch('getTodos');
    },
};
</script>
main.js

import Vue from 'vue';
import App from './App.vue';
import store from './store';
import './firebase';

Vue.config.productionTip = false;

new Vue({
    store,
    render: (h) => h(App),
}).$mount('#app');

firebase.js
import firebase from 'firebase';

const config = {
    apiKey: '****',
    authDomain: '****',
    databaseURL: '****',
    projectId: '****',
    storageBucket: '****',
    messagingSenderId: '****',
    appId: '****',
};
// Initialize Firebase
firebase.initializeApp(config);