创建钩子时出错:" ReferenceError:**方法**未定义",但显然位于同一位置

时间:2018-01-17 02:47:04

标签: javascript vue.js vue-component

我今天随机发生了一个奇怪的错误,即使我没有改变任何东西而且它昨天正在工作。我收到的错误是,在创建的钩子中调用方法fetchColorPalettes()时没有定义它。但它显然是定义的,它以前工作。我不知道发生了什么。

在一个文件(palettes.vue)中我有这段代码:

export default {
    name: 'palettes',
    data() {
        return {
            navItems: [
                {title: 'Palettes', selected: true},
                {title: 'Groups', selected: false},
                {title: 'Generator', selected: false}
            ],
            colorPalettes: []
        }
    },
    components: {
        'navbar': navbar,
        'page-header': pageHeader,
        'color-palette': colorPalette
    },
    methods: {
        // Get the color palettes from the Firestore DB and push them onto the colorPalettes array
        // TODO: Make this fetch only grab the palettes from current user that is logged in
        fetchColorPalettes() {
            db.collection("colorPalettes").get().then((querySnapshot => {
                querySnapshot.forEach((doc => {
                    const data = {
                        title: doc.data().title,
                        colors: doc.data().colors
                    }
                    this.colorPalettes.push(data)
                }))
            }))
            console.log("Fetching data");
        }
    },
    created() {
        fetchColorPalettes()
    }
}
</script>

这是给我这个错误的文件:

vue.esm.js?efeb:578 [Vue warn]: Error in created hook: "ReferenceError: fetchColorPalettes is not defined"

found in

---> <Palettes> at src/components/pages/Palettes.vue
       <App> at src/App.vue
         <Root>
warn @ vue.esm.js?efeb:578
logError @ vue.esm.js?efeb:1713
globalHandleError @ vue.esm.js?efeb:1708
handleError @ vue.esm.js?efeb:1697
callHook @ vue.esm.js?efeb:2897
Vue._init @ vue.esm.js?efeb:4560
VueComponent @ vue.esm.js?efeb:4728
createComponentInstanceForVnode @ vue.esm.js?efeb:4242
init @ vue.esm.js?efeb:4059
createComponent @ vue.esm.js?efeb:5512
createElm @ vue.esm.js?efeb:5460
updateChildren @ vue.esm.js?efeb:5749
patchVnode @ vue.esm.js?efeb:5840
patch @ vue.esm.js?efeb:6000
Vue._update @ vue.esm.js?efeb:2647
updateComponent @ vue.esm.js?efeb:2765
get @ vue.esm.js?efeb:3115
run @ vue.esm.js?efeb:3192
flushSchedulerQueue @ vue.esm.js?efeb:2954
(anonymous) @ vue.esm.js?efeb:1813
flushCallbacks @ vue.esm.js?efeb:1734
Promise resolved (async)
microTimerFunc @ vue.esm.js?efeb:1782
nextTick @ vue.esm.js?efeb:1826
queueWatcher @ vue.esm.js?efeb:3041
update @ vue.esm.js?efeb:3182
Vue.$forceUpdate @ vue.esm.js?efeb:2668
(anonymous) @ index.js?737e:221
(anonymous) @ index.js?737e:219
(anonymous) @ index.js?737e:104
(anonymous) @ Palettes.vue?dcb3:39
(anonymous) @ Palettes.vue?dcb3:44
./src/components/pages/Palettes.vue @ app.js:3097
__webpack_require__ @ app.js:679
hotApply @ app.js:608
(anonymous) @ app.js:290
Promise resolved (async)
hotUpdateDownloaded @ app.js:289
hotAddUpdateChunk @ app.js:266
webpackHotUpdateCallback @ app.js:8
(anonymous) @ 0.4e476bef286585c20fc2.hot-update.js:1
vue.esm.js?efeb:1717 ReferenceError: fetchColorPalettes is not defined
    at VueComponent.created (Palettes.vue?8bd4:56)
    at callHook (vue.esm.js?efeb:2895)
    at VueComponent.Vue._init (vue.esm.js?efeb:4560)
    at new VueComponent (vue.esm.js?efeb:4728)
    at createComponentInstanceForVnode (vue.esm.js?efeb:4242)
    at init (vue.esm.js?efeb:4059)
    at createComponent (vue.esm.js?efeb:5512)
    at createElm (vue.esm.js?efeb:5460)
    at updateChildren (vue.esm.js?efeb:5749)
    at patchVnode (vue.esm.js?efeb:5840)

palettes.vue通过路由器引用并显示在我的主app.vue中,但是没有与palettes.vue文件通信的代码。这一切都发生在那里。

知道发生了什么事吗?

0 个答案:

没有答案