programing

[Vue warn] :생성된 후크 오류: "TypeError: 정의되지 않은 속성을 설정할 수 없습니다"

randomtip 2022. 9. 1. 22:54
반응형

[Vue warn] :생성된 후크 오류: "TypeError: 정의되지 않은 속성을 설정할 수 없습니다"

VueJS 어플리케이션을 만들고 있습니다.부모로부터 데이터가 전달되는 Child.vue라는 하위 구성 요소가 있습니다.

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;
            }
        }
    }

}

그리고 제 부모 구성 요소는 이렇게 생겼고

Parent.vue

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>

응용 프로그램을 실행하려고 하면 다음과 같은 오류가 발생합니다.

에러

여기에 이미지 설명 입력

이 에러가 발생하는 이유제가 VueJs에 처음 왔는데 누가 좀 도와주실 수 있나요?

화살표 함수를 사용하여 메서드를 정의하지 마십시오.https://vuejs.org/v2/guide/instance.html#Data-and-Methods 에서 경고 상자를 참조하십시오.

this화살표 함수는 상위 컨텍스트를 가리키므로 여기서는 Vue 개체가 아닌 창 개체를 가리킵니다.

대신convertMins: (minutes) => {},사용하다convertMins(minutes) {}.

언급URL : https://stackoverflow.com/questions/47525044/vue-warn-error-in-created-hook-typeerror-cannot-set-property-of-undefined

반응형