How to assign a value to url in backgroundImage in vue?

<div class="img2" :style="{backgroundImage:"url(http://xx.com:8091//upload/17.jpg)"}"></div>


http://xx.com:8091//upload/17.jpg

http_url="http://xx.com:8091//upload/17.jpg";

http_url


ps::`<div class="img2" :style="{backgroundImage:"url("+http_url+")"}">
</div>`





dataworklist,itemworklist
<div v-for="src of item.images" class="img2" :style="{backgroundImage:"url("+src+")"}"></div>

:`<div v-for="src of item.images">{{src}}</div>`:`https://img.codeshelper.com/upload/img/2021/03/18/0wi1hzr1es210192.jpg`
`<div v-for="src of item.images" class="img2" :style="{backgroundImage:"url("+src+")"}"></div>`src:`D:/www/2.jpg`


normal string handling is not good?
'url (' + imageUrl+')', put imageUrl in the data of the component.

< hr >

I don't understand what "seems to be no good". Is it wrong or invalid? Write a test demo JSfiddle test .

the supplementary content is not posted code, and there is no specific error information, so I can't imagine it.


string template, ${}


can't you throw this style object directly into the calculation attribute, and then dynamically obtain this url and return it after stitching it? it is more troublesome to write directly in the template, and it is more troublesome to maintain it

.
Menu