vuejs v-html image tag not resolving src

问题

I have a vue page which uses v-html to place an html content inside a <div> as follows:

<div v-html="noDataMessage">               
</div>

And the data of noDataMessage is set in created() lifecycle hook of vue.

created() {  
   this.noDataMessage = "<img src='../assets/Content/img/Myfav_empty.png' width='35px' height='35px'>";
}

The html tag is showing properly, but it is not able to fetch the image. I tried to load the image separately to see if image path is correct, and got the image.

Am I missing anything particular to vue.js or v-html in particular?

回答1:

The issue is in the src url you are using, the src url root is the public directory.

For example, if you have all your images in public->images directory then your code will look like this:

this.noDataMessage = "<img src='images/Myfav_empty.png' width='35px' height='35px'>";

回答2:

It seems perfect only.

I have implemented the same way to fetch the image, Here I can see the image. Please check the path once again.

You can check below example where I have tried to implement same way :http://jsfiddle.net/suprabhasupi/eywraw8t/491005/

来源：https://stackoverflow.com/questions/53627981/vuejs-v-html-image-tag-not-resolving-src