Invalid default value for prop "...": Props with type Object/Array must use a factory function to return the default value.

문제점

{
    props: {
    	type: Object,
        default: {}
    }
}

[Vue warn]: Invalid default value for prop "data": Props with type Object/Array must use a factory function to return the default value.

Vue.js 컴포넌트의 props를 Object로 받는다. 기본 값이 없는 문제를 방지하기 위해 default에 제공되는 Object의 구조를 넣었는데 오류가 발생한다.

 

해결

공식 Vue.js 문서에도 명시되어 있듯이, Object나 Array의 default 항목은 function으로 감싸서 넣어야된다.

 

{
    props: {
    	type: Object,
        default: () => {
            return {}
        }
    }
}

다음과 같이 Object를 반환하는 function을 지정해주었더니, 해결되었다.