observer
在 Swiper 的上启用动态检查器(Mutation Observer),如果你更改swiper 的样式(隐藏/显示)或修改其子元素(添加/删除幻灯片),Swiper 会更新(重新初始化)并触发
默认
注意:隐藏swiper 和删除slide 会触发两次事件,因为slide 不是swiper 真正的一级子元素。
observerUpdate
事件。默认
false
,不开启动态检查器,此时可以使用 update() 方法手动更新。注意:隐藏swiper 和删除slide 会触发两次事件,因为slide 不是swiper 真正的一级子元素。
observer信息
- 类型:
- boolean
- 默认:
- false
- 举例:
- true
- 启用版本:
- 4.0.0
使用方法示例
从Swiper7开始,容器默认类名由'.swiper-container'变更为'.swiper'。
<script>
var mySwiper = new Swiper('.swiper', {
observer: true, //开启动态检查器,监测swiper和slide
pagination: {
el: '.swiper-pagination',
},
on: {
observerUpdate: function(){
alert('监测到DOM变化,更新Swiper')
},
},
})
$('#btn1').click(function(){
$(".swiper-slide1").remove(); // 删除Slide
// $('.swiper').hide(); // 隐藏Swiper
})
</script>
转载原创文章请注明:文章转载自:Swiper中文网 [https://www.swiper.com.cn]
本文地址:https://www.swiper.com.cn/api/observer/218.html