I tried to load a svg image on img tag in two ways. When I use the 1st way then it works well, but when I use the 2nd way then it doesn't work.
How to make the 2nd way(v-bind:) working well?
<template>
<div>
<img src="../../assets/ico_refresh-ccwb.svg"> <!-- 1st : working -->
<img :src="imgSrc"> <!-- 2st : not working -->
</div>
</template>
<script>
export default {
data(){
return{
imgSrc : '../../assets/ico_refresh-ccwb.svg'
}
}
}
</script>
@niddddddfier you need to prefix your imgSrc property with the require keyword. eg,
data(){
return{
imgSrc : require('../../assets/ico_refresh-ccwb.svg')
}
}