I'm experiencing an issue trying to bind CSS style with the object syntax to an image. The style object includes the CSS property background which refers to multiple background images, but unfortunately, these images are not showing up.
Template
<v-img
:src="require('../assets/background/bg_0.png')"
:style="bg"
></v-img>
Script
data() {
return {
bg: {
background: "url('~@/assets/pieces/animals/animal_1.png') no-repeat center, url('~@/assets/pieces/animals/animal_3.png') no-repeat center",
width: "300px",
height: "300px"
}
}
}
The properties for width and height are working fine, but the two images specified in the background property are not being displayed. What could be going wrong here?
Appreciate any assistance you can provide!