vue能不能使用swipe官网的vue实现轮播图图呢

你的位置：网站首页 >> 频道首页 >>前端开发 >>vue能不能使用swipe官网的vue实现轮播图图呢

点击联系发帖人 时间：2020-04-15 09:00

用vue实现轮播

上面是官方给的文档例子可是關于this.$imagePreview中的images官方的解释为：图片的url数组

可是却没有说明一个坑：当传递到的images图片的url链接没有在页面进行加载的时候(没有使用img标签引用)，那么苐一次调用$imagePreview会导致图片无法显示

将 images数组的url数组进入页面的时候使用img标签提前进行预加载，加上css display:none不显示即可

}

1.我们在components文件夹里创建一个swipe组件將需要用到的js以及css文件复制到assets/lib文件夹下，如图：

然后根据swiper的使用方法：

将html结构复制到swipe组件里引入css文件，以及js

保存预览会报错我们将swiper.js尾蔀需要修改一下

将AMD模式删掉，改成

我们可能在一个页面引用多个swipe组件就会发生命名冲突，所以我们在实例化swiper的时候类名需要变化一下，例如：

}