vueJS如何实现图片横向滑动
本篇内容主要讲解“vueJS如何实现图片横向滑动”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vueJS如何实现图片横向滑动”吧!
创新互联专业为企业提供茄子河网站建设、茄子河做网站、茄子河网站设计、茄子河网站制作等企业网站建设、网页设计与制作、茄子河企业网站模板建站服务,十载茄子河做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
vueJS实现图片横向滑动的方法:1、使用npm安装vue-awesome-swiper;2、在main.js中引用vue-awesome-swiper;3、使用swiper实现左右滑动切换图片即可。
本文操作环境:windows7系统、vue2.9.6版,DELL G3电脑。
vueJS怎么实现图片横向滑动?
vue使用swiper实现左右滑动切换图片:
使用npm 安装vue-awesome-swiper
npm install vue-awesome-swiper --save
在main.js中引用
import VueAwesomeSwiper from 'vue-awesome-swiper' Vue.user(VueAwesomeSwiper) import 'swiper/dist/css/swiper.css'
在组件中使用
效果
$refs定位不到的主要原因是因为v-if、v-for、v-show这些语句如果依赖父组件传来的参数的话,该参数是在mounted()阶段子还没获取得到。
如果想要真正地在DOM加载完成后拿到数据,就需要调用VUE的全局api : this.$nextTick(() => {})
到此,相信大家对“vueJS如何实现图片横向滑动”有了更深的了解,不妨来实际操作一番吧!这里是创新互联网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!
分享题目:vueJS如何实现图片横向滑动
文章网址:http://myzitong.com/article/jdejcp.html