2
respostas

Erro de JS no segundo curso de Vue3

Estou recebendo um erro de JavaScript em meu navegador. Parece que a variável store está vindo undefined.

Uncaught (in promise) TypeError: store is undefined

Tentei depurar e o erro estoura no setup, exatamente nessa linha do computed. realmente a variável store vem undefined.

projetos: computed(() => store.state.projetos)

Arquivo Formulario completo. Há algumas diferenças de nomenclatura, mas em essência o código é o mesmo daquele do curso.

import { computed, defineComponent } from "vue";
import TemporizadorGeral from "./TemporizadorGeral.vue";
import { useStore } from "vuex";
import { key } from "@/store";


export default defineComponent({
    name: "FormularioPadrao",
    emits: ["executarSalvarTarefa"],
    components: {
        TemporizadorGeral
    },
    data() {
        return {
            descricao: "",
            idProjeto: ""
        }
    },
    methods: {
        finalizarTarefa(tempoDecorrido: number): void {
            this.$emit("executarSalvarTarefa", {
                duracaoSegundos: tempoDecorrido,
                descricao: this.descricao,
                projeto: this.projetos.find(p => p.id == this.idProjeto)
            })
            this.descricao = ""
        }
    },
    setup() {
        const store = useStore(key)
        return {
            projetos: computed(() => store.state.projetos)
        }
    }
});

Log completo do Erro:

Uncaught (in promise) TypeError: store is undefined
    projetos FormularioPadrao.vue:33
    run reactivity.esm-bundler.js:185
    get value reactivity.esm-bundler.js:1147
    unref reactivity.esm-bundler.js:1053
    get reactivity.esm-bundler.js:1056
    get runtime-core.esm-bundler.js:3098
    render FormularioPadrao.vue:36
    renderComponentRoot runtime-core.esm-bundler.js:890
    componentUpdateFn runtime-core.esm-bundler.js:5598
    run reactivity.esm-bundler.js:185
    update runtime-core.esm-bundler.js:5712
    setupRenderEffect runtime-core.esm-bundler.js:5726
    mountComponent runtime-core.esm-bundler.js:5508
    processComponent runtime-core.esm-bundler.js:5466
    patch runtime-core.esm-bundler.js:5068
    mountChildren runtime-core.esm-bundler.js:5252
    processFragment runtime-core.esm-bundler.js:5425
    patch runtime-core.esm-bundler.js:5061
    componentUpdateFn runtime-core.esm-bundler.js:5605
    run reactivity.esm-bundler.js:185
    update runtime-core.esm-bundler.js:5712
    setupRenderEffect runtime-core.esm-bundler.js:5726
    mountComponent runtime-core.esm-bundler.js:5508
    processComponent runtime-core.esm-bundler.js:5466
    patch runtime-core.esm-bundler.js:5068
    componentUpdateFn runtime-core.esm-bundler.js:5678
    run reactivity.esm-bundler.js:185
    update runtime-core.esm-bundler.js:5712
    callWithErrorHandling runtime-core.esm-bundler.js:155
    flushJobs runtime-core.esm-bundler.js:388
    promise callback*queueFlush runtime-core.esm-bundler.js:280
    queueJob runtime-core.esm-bundler.js:274
    effect runtime-core.esm-bundler.js:5710
    triggerEffect reactivity.esm-bundler.js:394
    triggerEffects reactivity.esm-bundler.js:384
    triggerRefValue reactivity.esm-bundler.js:1000
    effect reactivity.esm-bundler.js:1134
    triggerEffect reactivity.esm-bundler.js:394
    triggerEffects reactivity.esm-bundler.js:379
    triggerRefValue reactivity.esm-bundler.js:1000
    effect reactivity.esm-bundler.js:1134
    triggerEffect reactivity.esm-bundler.js:394
    triggerEffects reactivity.esm-bundler.js:379
    triggerRefValue reactivity.esm-bundler.js:1000
    effect reactivity.esm-bundler.js:1134
    triggerEffect reactivity.esm-bundler.js:394
    triggerEffects reactivity.esm-bundler.js:379
    triggerRefValue reactivity.esm-bundler.js:1000
    effect reactivity.esm-bundler.js:1134
    triggerEffect reactivity.esm-bundler.js:394
    triggerEffects reactivity.esm-bundler.js:379
    triggerRefValue reactivity.esm-bundler.js:1000
    set value reactivity.esm-bundler.js:1045
    finalizeNavigation vue-router.mjs:3334
    pushWithRedirect vue-router.mjs:3207
    promise callback*pushWithRedirect vue-router.mjs:3173
    push vue-router.mjs:3099
    install vue-router.mjs:3530
    use runtime-core.esm-bundler.js:4352
    <anonymous> main.ts:7
    ts app.js:217
    __webpack_require__ app.js:849
    __webpack_exports__ app.js:1971
    O app.js:895
    <anonymous> app.js:1972
    <anonymous> app.js:1974
FormularioPadrao.vue:33
2 respostas

Salve, Gabriel!

O import da key ta chegando direitinho? Consegue compartilhar o repositório do projeto? Assim consigo te ajudar mais facilmente :)

Pelo que eu depurei, parece que não, mas posso ter visto errado, sou bem iniciante com front-end.

Link para o repo: https://github.com/gaabriel000/alura-tracker