Front-End

[Vue warn]: Invalid prop: type check failed for prop “value”. Expected Array, got Object 해결방법

[Vue warn]: Invalid prop: type check failed for prop “value”. Expected Array, got Object 

[Vue warn]: Error in callback for watcher “value”: “TypeError: value.reduce is not a function”

주의가 떴다. JSON 타입의 객체 데이터를 배열로 선언한 값으로 지정하려고 할 때 발생되었다.


[오류 원인]

데이터를 받는 변수를 배열로 선언했지만 그 변수의 value값으로 object(객체)를 대입하면 발생하는 경고이다.

동작하는데 문제는 없지만 주의를 주는 것이다.

<script>
export default {
  name: "App",
  components: {
  },
  data: () => ({
	popupParams: {
		searchContents: '',
	},
	reqParams: {
	},

	itemList: [],	   
  }),
};
</script>
      console.log(`변수 타입 체크 -> ${typeof item}`);
      console.log(`${JSON.stringify(item)}`);

[오류 해결]

변수를 객체로 선언하거나 대입하는 값을 객체에서 배열로 변경한다.

itemList: []  --- > itemList: {}

또는 

const sdkfjls = item[0];
this.itemList = sdkfjls;

 

[연관 자료]

 

 

 

Leave a Reply

error: Content is protected !!