[Vue.js] vue 이미지 src 동적 연결 (v-bind)

vue 이미지 변수로 연결하기

 

vue에서 프로젝트 폴더 assets에 있는 이미지를 가져올 때, 해당 변수명을 v-bind로 동적으로 설정하면 경로를 제대로 설정해도 읽어오지 못하는 문제가 발생한다.

 

이때는 src를 정적인 값으로 설정하거나, require를 활용하여 동적인 값을 읽어올 수 있도록 해야 한다

<img :src="require(@assets/images/${변수명}.png)"/>