微信小程序中滚动事件deltaX值的含义
以横向滚动为例,
上代码:
uniapp
<scroll-view class="scroll-box" scroll-x @scroll="scroll" :scroll-with-animation="true" enable-flex >
<view class="swiper-item content"></view>
</scroll-view>
let start:number,end:number
const scroll = debounce(
(event: { detail: { deltaX: number; scrollLeft: number } }) => {
const { scrollLeft: x, deltaX } = event.detail
if(!start){
start = x
}
console.log(x,end - x, deltaX)
end = x
},
10,
{ maxWait: 1000 }
)
运行代码后你会发现end - x === deltaX
,deltaX表示方向同时表示滚动单位时间内的滚动距离,上面的示例是单位时间为10ms,距离/时间=速度
,再加上滚动阻尼系数就能确定滚动位置的终点了。
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· [翻译] 为什么 Tracebit 用 C# 开发
· 腾讯ima接入deepseek-r1,借用别人脑子用用成真了~
· Deepseek官网太卡,教你白嫖阿里云的Deepseek-R1满血版
· DeepSeek崛起:程序员“饭碗”被抢,还是职业进化新起点?
· RFID实践——.NET IoT程序读取高频RFID卡/标签