本来轮播图的图片正常显示,但是用了v-for之后图片没了

来源:7-4 Vue项目首页 - 首页轮播图

PeppaHe

2019-03-25

本来轮播图的图片正常显示,但是用了v-for之后图片没了,那一块是空白的

写回答

6回答

奕帝传说_梦

2020-05-20

<script>
 export default {
   name: 'HomeSwiper',
   data:function () {
     var x=require("../../../assets/image/Hong2.jpeg");
     var y=require("../../../assets/image/Hong3.jpg");
     var z=require("../../../assets/image/Hong4.jpg");
     return {
       swiperOptions:{
         pagination:".swiper-pagination",
         loop:true,
       },
       swiperList:[{
         id:"0001",
         imgUrl:x
       },{
         id:"0002",
         imgUrl:y
       },{
         id:"0003",
         imgUrl:z
       }]
     }
   }
 }
</script>

本地的要这样写

0
0

慕后端7334286

2020-04-21

一样的问题,我把图片放在本地的images文件夹内,本来正常显示,用了v-for同样图片没显示,后来用了网络图片就可以了


0
0

慕妹4365742

2020-04-14

如果用的本地图片需要在data中require一下就能正常显示了,否则在打包的时候路径要变

0
0

百年叔叔

2019-06-26

<script>
export default {
 name: 'HomeSwiper',
 data: function () {
   return {
     swiperOption: {
       pagination: {
         el: '.swiper-pagination'
       },
       loop: true
     },
     swiperList: [
       {
         id: '0001',
         imgUrl: 'http://mp-piao-admincp.qunarzz.com/mp_piao_admin_mp_piao_admin/admin/20195/aef5f8864f5a1167599609307571b2c4.jpg_750x200_db7bedbe.jpg'
       }, {
         id: '0002',
         imgUrl: 'http://mp-piao-admincp.qunarzz.com/mp_piao_admin_mp_piao_admin/admin/20196/13484aec53ee7364ad3e2b95828c2446.jpg_750x200_0e31fdea.jpg'
       }]
   }
 }
}
</script>

0
0

weibo_一路向北都是谎言_03667176

2019-06-08

这是图片路径问题,需要把图片文件放到static里面储存才能用相对路径来获取

0
0

Dell

2019-03-25

你看看循环的数据有值么

0
0

Vue2.5-2.6-3.0开发去哪儿网App 零基础入门到实战

课程紧跟Vue3版本迭代,企业主流版本Vue2+Vue3全掌握

10675 学习 · 8191 问题

查看课程