Comments (5)
yezhonghu0503
commented on July 3, 2024
1
用内部demo验证了一下，确实有这个问题，很有趣的bug，我想试试改一下🙋
from ant-design.
yezhonghu0503
commented on July 3, 2024
看了下源码，贴一个示例：Rc-Slider示例
这个问题产生的原因可能得追溯到更底层的滑块库Rc-Slider，通过示例，Rc-Slider也有这个问题，并且在示例中改变disabled的值会发现这是一个必现的问题，可以先去Rc-Slider先提个issues（手动狗头）
from ant-design.
yoyo837
commented on July 3, 2024
rc那边维护者不怎么关注，有问题也建议提到antd这里来
from ant-design.
yezhonghu0503
commented on July 3, 2024
ok，我先看看问题具体的原因，后续再讨论
from ant-design.
yezhonghu0503
commented on July 3, 2024
这个问题的原因并非组件bug，HTML标准规范中对disabled属性有一条定义是阻止所有在这个元素上的鼠标事件，滑块释放控制应该是在mouseup事件里面触发的，但是当鼠标移入到有disabled属性的元素时，mouseup事件被阻止了，意味着滑块丢失了鼠标的状态，没办法触发mouseup去释放滑块控制
想了一个方案：在滑块组件层面做一个全局蒙层，并且使得z-index为99，滑块的z-index为100，也就是说创造一个只有当前滑块的空间，蒙层触发的时机是鼠标按下滑块，取消蒙层的时机则是在这个空间上触发mouseup事件，但是不知道这样会不会其他问题，并且这个问题本身触发条件相对比较苛刻：需要鼠标按下滑块，鼠标离开滑块，鼠标前往一个设置了disabled属性的元素，鼠标必须在这个元素中放开。
由于触发条件的原因，其实没必要在组件层面修改，实在想要避免，可以通过事件委托和自定义disabled样式来处理
from ant-design.
Related Issues (20)
- Tour组件onClose回调方法current值有误，以及steps多步骤里面的onClose始终调用第一个step的
- Ant Table Sort not working with null values HOT 1
- 关于 Tooltip 的 overlayInnerStyle 属性上添加 css样式 可能会出现闪烁情况 HOT 1
- New component: Toolbar HOT 6
- Dropdown support extra prop HOT 1
- Table 编辑行 ellipsis 失效 HOT 4
- 【bug】表格排序错误的排序出参 HOT 2
- Select组件通过 dropdownRender 自定义虚拟列表 Table, 提示React does not recognize the offsetX prop on a DOM element HOT 5
- 无法使用antd包 HOT 4
- [Wrong statement]Why is component defaultValue not working when inside Form.Item? HOT 4
- Badge 徽标数 设置了color时 count为0时 本该消失，但仍显示小红点 HOT 4
- Colorpicker dragging too many times will be banned HOT 11
- Modal组件的destroyOnClose属性无法销毁其中Form组件具有form属性时的状态 HOT 1
- 受控的Select组件，onChange中setValue为undefiend后，展示的label与实际的值不一致 HOT 3
- Dropdown 菜单支持展示 Checkbox HOT 5
- 父层级设置了scale后，Select下拉列表展开错误 HOT 1
- Table: Horizontal scrollbar is between table and fixed summary HOT 1
- DatePicker crashes when input is custimized via components props HOT 4
- datepicker 能否支持修改表头星期样式 HOT 4
- > Picker will set `locale` to dayjs object before format to ensure it get correct format with locale. Which means it's not enough to set timezone only and should provide fully local info. Pls ref official doc of ConfigProvider with correct locale handle. HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ant-design.