vue에서 image load 정상여부 체크하기

image를 가져오는데 성공하면 화면에 form이 보여지고, 실패하면 화면에 form이 가려지도록 하는 요청사항이 있다.

 

다음과 같이 @error 로 호출함수를 정의하면 이미지 로드 실패 시 함수가 호출된다.

해당 함수 내에서, 실패 시 보여주지 않아야할 요소에 대해서 flag처리를 해주면 된다

 

<b-img class="w-100" @error="imageLoadError" thumbnail center :src="submissionDetail.proof_of_residential_address" alt="Image 2"></b-img>

imageLoadError() {
      this.isShowResidentialAddress = false;
},