Estoy usando Chartjs para crear un gráfico que muestre la información presente en mi base de datos, aunque se muestra la información, sigo recibiendo los siguientes errores:
vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in created hook (Promise/async): "TypeError: Cannot read property 'position' of undefined" found in ---> <Reports> at src/views/Reports.vue <VMain> <VApp> <Navbar> at src/layout/Navbar.vue <App> at src/App.vue <Root>Y éste:
TypeError: Cannot read property 'position' of undefined at _callee$ (Reports.vue?0011:53) at tryCatch (runtime.js?96cf:63) at Generator.invoke [as _invoke] (runtime.js?96cf:294) at Generator.eval [as next] (runtime.js?96cf:119) at asyncGeneratorStep (asyncToGenerator.js?1da1:3) at _next (asyncToGenerator.js?1da1:25)El error me apunta a esta función, que es donde paso la información al gráfico.
async created() { const { data } = await axios.get("http://localhost:4000/users"); var c = 0 for (var i = 0; i < 1000; i++) { if (data[i].position in this.labels) { continue } else { this.labels.push(data[i].position) this.confirmed.push(data[i].id) c = c + 1 if (c == 28) { break } } } console.log(this.labels) }Nota: Mi base de datos incluye las posiciones de las columnas, el Id. y el nombre.
Si está utilizando created o fetch o cualquiera, entonces debe envolverlo en la declaración if como:
if(process.client){ //your code to fetch data from the server. }Espero que también resuelva tu problema.
¿Estás seguro de que const { data } = ... es correcto? axios.get devuelve una Promesa que se resuelve en { response: { data: {}} no { data: {} }