本质上就是数据加载顺序,生命周期的问题。
swiper
提前初始化了,而这个时候,数据还没有完全出来。
swiper
入手,在swiper
中写 observer:true/observeParents:true
1 let myswiper = new Swiper(".swiper-container" , { 2 autoplay: true, 3 loop: true, 4 // observer 修改swiper子元素时自动初始化swiper 5 observer:true, 6 // observeParents 包括当前父元素的swiper发生变更时也会初始化swiper 7 observeParents:true, 8 })
Vue
入手,vue
中专门提供了提供了一个方法nextTick()
用于解决dom
的先后执行问题。1 mounted(){ 2 this.$nextTick(function(){ 3 // ...操作 4 let myswiper = new Swiper(".swiper-container" , { 5 autoplay: true, 6 loop: true 7 }) 8 }) 9 }
swiper 插件从后台获取数据没问题,css 代码啥的也没问题, 但是图片不动,应该怎么解决?
原文:https://www.cnblogs.com/XH-jing/p/13603900.html