반응형 이미지대체1 img태그 onError 처리하기 (대체 이미지) Next.js같은 경우는 Image태그를 사용하라고 권장하지만 react와 next.js에서 img태그를 사용할 시에 대체 이미지 처리하는 방법을 기록해둔다. 상단의 이미지와같이 존재하지 않는경우 대체이미지를 띄우게 할 수 있는데 단순 삼항연산자 조건문으로 설정해도 되겠지만 그래도 혹시나 파일이 없을 때 대체 이미지를 띄우는 방식을 알아두자, 특히 외부 링크로 사진을 가져올 때 필요할것 같다. 이와같이 사용한다고 치면 src = 이미지링크 alt = 이미지가 없을시 나타내줄 설명 그리고 onError 부분이 본 링크 이미지가 없을때 대체 해서 실행해주는 부분이다. react와 next.js에서는 따로 함수를 만들어 사용해준다. const default_img = "ramen/default.png"; co.. 2022. 4. 2. 이전 1 다음 반응형
