好资源导航 » 文章资讯 » vue+swiper实现组件化开发的实例代码

vue+swiper实现组件化开发的实例代码

2023-09-22 12:47:05 60

swiper的组件




.swiper-container{
width:100%;
height:4rem;
margin-top:0.9rem;
.swiper-wrapper{
width:100%;
height:100%;
.swiper-slide{
background-size:cover;
width:100%;
height:4rem;
img{
width:100%;
height:100%;
}
}
}
}

home.vue调用的组件方法

//html

//js
importswiperfrom'components/swiper/swiper'
components:{
swiper
},

问题：如果单纯的调用_initSwiper的方法，会发现页面是不能滚动的，但是页面随便修改东西，然后保存的swiper又可以滚动的，这个个原因是初始swiper的节点没有创建成功，值页面有穿进去的，一层一层的可以打印swiper的值为空的，当修改东西值就能传递进去的，所以的这里的我们需要通过判断节点是否成功来updatesiwper的方法

返回顶部
514930285
czq8825@qq.com

vue+swiper实现组件化开发的实例代码

热门推荐

随机推荐