VUE style中设置background-image时的路径问题
1. VUE 在style中设置background-image时路径问题在写一个自己的小案例的时候遇到了这个问题。网上找了诸多案例基本上都是在data数据层写数组里面加上require('图片路径')这种写法。//常见并且常用的方式<script>data(){return{list:[{url:require('../1.jpg')}{url:require('../2.jpg')
·
1. VUE 在style中设置background-image时路径问题
在写一个自己的小案例的时候遇到了这个问题。
网上找了诸多案例基本上都是在data数据层写数组里面加上require('图片路径')
这种写法。
//常见并且常用的方式
<script>
data(){
return{
list:[
{url:require('../1.jpg')}
{url:require('../2.jpg')}
]
}
}
</script>
而我想直接在style上去写,不想费劲的去在数据层写了
实际上require这个函数
是可以直接在style里面加的与上同理上
代码如下↓
//奇奇怪怪的方式,很少能用到,不过这次我用到了
<template>
<div class="list">
<div v-for="(item,key) in 9" :key="key" class="li">
<div class="inner">
<div :style="'background-image:url('+require('./../assets/examples/'+item+'.jpg')+')'" class="img"></div>
</div>
</div>
</div>
</template>
更多推荐
已为社区贡献3条内容
所有评论(0)