[Vue warn]: Fehler im erstellten Hook: "TypeError: Eigenschaft von undefined kann nicht festgelegt werden"


CoderPJ

Ich erstelle eine VueJS-Anwendung. Ich habe eine untergeordnete Komponente, Child.vue, an die Daten von einem übergeordneten Element übergeben werden.

Child.vue

export default{

    props:['info'],

    data: function(){
        return{
            timeValue:{
                minutes: '',
                hours: ''
            }
        }
    },
    created: function(){
        
        console.log("Printing inside created of Child ",this.info);
        this.convertMins(this.info[0][2]);
        
    },

    methods:{
        convertMins: (minutes) => {
            console.log("Printing inside convert mins", this);
            if(minutes===0){
                this.timeValue.minutes = 0;
                this.timeValue.hours = 0;
            }
            if(minutes===60){
                this.timeValue.hours = 1;
                this.timeValue.minutes = 0;
            }
            if(minutes>60){
                this.timeValue.hours = Math.floor(minutes/60);
                this.timeValue.minutes = minutes % 60;
            }
        }
    }

}

Und meine übergeordnete Komponente sieht so aus:

Parent.view

import Child from './Child.vue';

export default {
data(){
	return{
        info:[ ],

        errors: []
	}
},

created: function(){

  this.accessInformation();
},

methods: {
    
    accessInformation: function(){
    axios.get(localhost:3000/retrieveInfo)
    .then(response =>{
    console.log(response.data.rows[3]);
    this.info.push(response.data.rows[3]);
   })
   .catch(e => {
            this.errors.push(e);
   })
 }
},

components: {								
    'child': Child,
    
  }
}
<template>
 <div>
   <child v-bind:info="info" v-if="info.length > 0"></child>
 </div>
</template>

Wenn ich versuche, die Anwendung auszuführen, wird folgende Fehlermeldung angezeigt:

Error

Geben Sie hier die Bildbeschreibung ein

Warum erhalte ich diesen Fehler? Ich bin neu bei VueJS. Kann mir bitte jemand hier raushelfen?

Flunder

Verwenden Sie keine Pfeilfunktionen, um Methoden zu definieren. Siehe das Warnfeld unter https://vuejs.org/v2/guide/instance.html#Data-and-Methods

Verwandte Artikel


vue asynchroner Aufruf im erstellten () Lebenszyklus-Hook

eisig Ich muss unten Methode in aufrufen created(). Zu diesem Zweck muss ich created()als machen async. Per Vue-Dokumentation created()wird synchron aufgerufen . Will Vue Rahmen awaitauf created()alle Rennbedingungen zu vermeiden? this.isAuthenticated = await

Vue / Vuex warten auf asynchronen Versand im erstellten Hook

Bergahorn55 Ich habe Probleme, eine asynchrone Funktion zu erstellen, die Daten aus der Firebase übernimmt: Wenn eine Komponente erstellt wird, habe ich: created(){ this.$store.dispatch("fetchSections"); } Vuex-Aktion: actions: { async fetchSections({ co

getEvents von undefined im erstellten Hook, Vue Kalendar-Plugin

Mtlj1991 Wenn Sie Probleme mit der Vue Kalendar-App haben, befolgen Sie die Anweisungen genau. Link hier: https://kalendar.altinselimi.com/?ref=madewithvuejs.com Ich habe Folgendes in meinem Code (musste kalendar-vue.css in KalendarVue.css ändern, damit das fu

Vue / Nuxt.js - APIs werden im erstellten Hook zweimal aufgerufen

Es ist Andrew Ich entwickle derzeit in Nuxt.js und wie die meisten Anfänger wollte ich den besten Lifecycle-Hook kennen, um API-Aufrufe zu platzieren. Viele Ressourcen, die ich gefunden habe, ähnlich wie die unten stehende, besagen, dass der created()Hook der