Soy nuevo en vue.js y parece que no puedo entender qué está mal en este código.

Cada vez que cargo la página, aparece el error mencionado a continuación, lo que hace que la página se atasque.

 Error in created hook (Promise/async): "ReferenceError: document is not defined"

Este es el componente que creé. Adjunto el código a continuación. Con la esperanza de encontrar algunas ideas sobre esto.

 <template> <div v-cloak id="doc-view-layout"> <v-container v-else> <div id="doc-view-header-container"> <DocumentViewHeader :title="title" /> </div> <div id="citation-container"> <v-row> <v-col cols="9"> <citation-card id="citations" class="citation-card" /> <citation-card id="similar-articles" class="citation-card" /> </v-col> </v-row> </div> </v-container> </div> </template> <script> import $ from 'jquery'; //imports export default { components: { //components }, async fetch() { }, data() { //task }, computed: { //some task }, async created() { this.loading = true; let data = null; switch (this.idType){ case 'pid': data = await this.getDataFromServer({pid: this.docId}); break; default: this.loading = false; return; } this.title = data.paper.title; this.loading = false; }, mounted() { //do some task }, methods: { //do something }, layout: 'search' }; </script>

Los detalles de la llamada a la API se encuentran a continuación:

 getDataFromServer ({context}, { pid }) { return this.$axios.$get('/info', { params: {paper_id: pid}}) },

La API del servidor mencionada anteriormente funciona bien.