Sortablejs中scrollSensitivity不起作用

当使用Sortablejs时内容出现滚动条,为了控制拖拽的位置需要鼠标接近边缘的时候自动滚动

官网给出的三个设置属性为

 scroll: true, //类型:Boolean,设置拖拽的时候滚动条是否智能滚动。默认为真,则智能滚动,false则不智能滚动

 scrollSensitivity: 30, //滚动的灵敏度,其实是拖拽离滚动边界的距离触发事件的距离边界+-30px的地方触发拖拽滚动事件

 scrollSpeed: 10, //滚动速度

上面时默认的数据,但我发现设置 scrollSensitivity之后并没有效果去查看了这个库的issue之后发现

有些人也出现了这个问他,在1.7.0版本里似乎可以使用,升级之后就不可以了,作者提出可以加上forceFallback: true解决这个问题,同时也说明了可能会影响到使用原生DnD API的能力

  • 使用 forceFallback: false 是告诉 Sortable.js “尽可能使用现代的方式进行拖拽”,这通常意味着更流畅的用户体验

  • 设置 forceFallback: true 则是说 “即使牺牲一些体验上的优势,也要确保拖拽功能在所有环境下都能正常工作”。

另外当你使用 forceFallback={true} 时,sortablejs 不再依赖浏览器的原生拖放 API,而是使用自己的事件处理机制。这样可以避免与 react-dnd 使用的原生拖放 API 发生冲突,可以用来解决如Cannot have two HTML5 backends at the same time.这一类问题

github地址:https://github.com/SortableJS/Sortable/issues/1443

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值