Vue3 单文件组件(SFC)中style调用JS中的图片作为背景

1. 假设有四种颜色图片 先设置一个变量

let imgColor = ref('red') // 设置图片名称`

2. 通过 imgColor 的变化设置可变图

let bgImage = computed(() => {
    return require(`@/图片路径/${imgColor}.图片格式`)
})

3. 在 中使用 bgImage

.div{
    background: v-bind("`url(${bgImg}) no-repeat center`");
 }