proper way to bind a variable url to background-image

[alephpi]

I have a assets of images

.vitepress
|-theme
   |-assets
      |-wallpaper
         |-default.png
   |-components
      |-Home.vue

And in Home.vue, I want to bind a variable bgImgUrl to the background-image
where const bgImgUrl = `url('../assets/wallpaper/${title}.png')`
I tried background-image: v-bind(bgImgUrl), but the image is not rendered.
However If I just use background-image: url('../assets/wallpaper/default.png'), this works, but it will not be variable.

I am really confused, by the way the inline binding doesn't work either.
I think the problem lies the entanglement of three things: url(), v-bind() and the url resolution specificity of vitepress, and I really don't know how to deal with them.