Vue를 이용해서 화면을 구성하는데 Type error undefined~ 오류가 발생하면서 화면이 그려지지 않고 스크립트가 멈춰버리는 문제가 발생했다. 이제 그 문제가 무엇인지 그리고 내가 찾은 해결방법이 무엇인지 소개하고자 한다.
Type error undefined 라는 문장에서 유추할 수 있듯이 정의되지 않은 값을 참조하려고 했기 때문에 생긴 오류이다. 나의 경우에는 화면에서 ajax를 통해 얻은 json데이터를 바로 사용하려고 했다. 하지만 데이터가 만들어지기도 전에 화면이 만들어지면서 Type error undefined오류가 발생한 것이다. 그러면서 화면 자체가 멈춰버리면서 아무것도 보이지 않게 되었다.
내가 해결한 방법은 v-if, v-for를 이용해서 데이터에 접근한 것이다.
데이터가 없다면 참조하지 않고 넘어갈 수 있도록 flag를 만들어주는 것이 필요했던 것이다.
바로 참조하는것이 문제였기 때문에 v-if, v-for를 이용해서 한 번 데이터가 있는지 체크한 이후부터는 Type error undefined 에러를 피할 수 있었다.