问题描述:后台返回一个imgs的数组,里面是图片的url,通过v-for在前台轮播展示。
通过require()方法实现。代码如下:
<template>
<div>
<slider>
<slider-item slot='image' v-for="(item) in imgs">
<!-- <img :src="require('${item}')" /> -->
<img :src="require(`${item}`)">
</slider-item>
</slider>
</div>
</template>
<script>
import Slider from 'common/slider/Slider.vue'
import SliderItem from 'common/slider/SliderItem.vue'
export default {
name: '',
data () {
return {
imgs:["./whr.jpg","./whr.jpg","./whr.jpg"]
}
},
methods: {
},
components:{
Slider,
SliderItem
}
}
</script>
<style scoped="scoped">
</style>
主要的代码就是
<img :src="require(`${item}`)">