vue横向列表,滚动到指定下标位置,超级简洁方案。

使用Vue,通过添加ref属性和JavaScript的scrollIntoView()方法,轻松实现在横向列表中点击滚动到指定下标位置,避免复杂的计算和动画代码。
摘要由CSDN通过智能技术生成

网上找了半天找不到,自己照思路实现了最简洁的办法。

样式效果:以下是布局和滚动代码:

原理就是给子div添加ref="idSwiperImg",在点击事件时,获取到相应的子div:this.$refs.idSwiperImgItem[index];,调用移动到view:targetLocation.scrollIntoView();即可。

太简洁了,省去了大堆计算位置,移动位置的代码。

              <div class="showViewerRightBottomImg" ref="idSwiperImg">
                <div v-for="(task, tttIdex) in tesrList" :key="tttIdex" class="showViewerRig
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值