uniapp的swiper动态设置current值不生效解决办法

红太狼 2023-10-04 19:12 27阅读 0赞

当只是给了current值的时候，当你通过js重新设置为0时，不生效:

![09ee30a215894a9cb4ed0ecc690b0e21.png][]

原因：current属性绑定的值（currentswiper）没有随着swiper的滑动而改变  
解决办法：监听滑块change事件，手动给currentswiper赋值

需要加上@change事件，而且是必须加上才可以:

![d93e746464644db995b1dd88294e44f2.png][] 然后在change事件里设置：

![31069198840247ed85ad6c2cddaccf9d.png][]

changeswiper(e) {
    				this.currentImgIndex = e.detail.current
    			}

changeswiper方法是为了在swiper改变时实时的更新currentswiper 的值，如果不加这个方法手动滑动时currentswiper 不会随着滑动而改变会一直为0（初始值），因为currentswiper 值没有改变initcurrent 方法就不会生效swiper就不会回到第一个滑块

官方文档是这么说的

官方提供了两种解决办法（以swiper为例）  
一：监听change事件，记录下当前的current的值this.old = e.detail.current ,在调用initcurrent方法重置滑块的时候先给currentswiper 赋值为old 的值，后再重置currentswiper 为0.  
二：监听change事件，当current的值改变时把current的值赋给currentswiper ，然后再重置currentswiper 为0.（也就是上面的方法）

![a99cf9e41a2d42ceaf5eb73dba06abf5.png][]

[09ee30a215894a9cb4ed0ecc690b0e21.png]: https://img-blog.csdnimg.cn/09ee30a215894a9cb4ed0ecc690b0e21.png
[d93e746464644db995b1dd88294e44f2.png]: https://img-blog.csdnimg.cn/d93e746464644db995b1dd88294e44f2.png
[31069198840247ed85ad6c2cddaccf9d.png]: https://img-blog.csdnimg.cn/31069198840247ed85ad6c2cddaccf9d.png
[a99cf9e41a2d42ceaf5eb73dba06abf5.png]: https://img-blog.csdnimg.cn/a99cf9e41a2d42ceaf5eb73dba06abf5.png