Fix the problem that the Slider's Tooltip is in the incorrect position when use modal #16717
Fix the problem that the Slider's Tooltip is in the incorrect position when use modal #16717zombieJ merged 8 commits intoant-design:masterfrom
Conversation
|
ref: #16669 |
|
Deploy preview for ant-design ready! Built with commit 951b03f |
Codecov Report
@@ Coverage Diff @@
## master #16717 +/- ##
==========================================
- Coverage 95.75% 95.7% -0.06%
==========================================
Files 258 258
Lines 7140 7142 +2
Branches 1974 1999 +25
==========================================
- Hits 6837 6835 -2
- Misses 301 305 +4
Partials 2 2
Continue to review full report at Codecov.
|
Codecov Report
@@ Coverage Diff @@
## master #16717 +/- ##
==========================================
+ Coverage 95.75% 95.75% +<.01%
==========================================
Files 258 258
Lines 7140 7141 +1
Branches 1974 1974
==========================================
+ Hits 6837 6838 +1
Misses 301 301
Partials 2 2
Continue to review full report at Codecov.
|
components/slider/index.tsx
Outdated
| placement="top" | ||
| transitionName="zoom-down" | ||
| key={index} | ||
| getPopupContainer={() => (this.tooltipRef ? this.tooltipRef.current.handle : document.body)} |
There was a problem hiding this comment.
默认还是应该放在 body 里的，加个 getTooltipPopupContainer 属性让用户自己修改吧~
There was a problem hiding this comment.
不用啊 这是特殊场景 应该放在handle这里的 我这里函数没有必要 直接三目就好了
There was a problem hiding this comment.
https://github.com/react-component/* 那一套没点时间真的不熟悉 🙃
There was a problem hiding this comment.
popup 放在外面是为了防止样式污染，以及外部容器如果用了 overflow: hidden 显示不全。
There was a problem hiding this comment.
那要写个example啊 不然用户要看代码才能知道那个ref是什么
|
@zombieJ 用户要么加个元素挂上去 要么就挂在slider的ref上 这个要看代码的 我把slider的ref public了 |
| id?: string; | ||
| style?: React.CSSProperties; | ||
| tooltipVisible?: boolean; | ||
| getTooltipPopupContainer?: (triggerNode: HTMLElement) => HTMLElement; |
There was a problem hiding this comment.
加到 rc-slider 里去吧，那里也有类似的问题。
There was a problem hiding this comment.
rc-slider怎么有一个createSliderWithTooltip
There was a problem hiding this comment.
这个 Tooltip 是包裹 Slider Handle 出来的，不是 rc-slider 的 bug。这个 PR 合进去后，指引过来就行了。
There was a problem hiding this comment.
是挺神奇的，估计是用于包裹 antd 的 Tooltip 来统一样式。 @afc163 看看我猜的对不对……
|
文档更新一下~ |
|
@zombieJ 啥文档 |
|
|
components/slider/index.zh-CN.md
Outdated
| | onAfterChange | 与 `onmouseup` 触发时机一致，把当前值作为参数传入。 | Function(value) | NOOP | | ||
| | onChange | 当 Slider 的值发生改变时，会触发 onChange 事件，并把改变后的值作为参数传入。 | Function(value) | NOOP | | ||
| | tooltipVisible | 值为`true`时，Tooltip 将会始终显示；否则始终不显示，哪怕在拖拽及移入时。 | Boolean | | | ||
| | getTooltipPopupContainer | 浮层渲染父节点，默认渲染到 body 上。 | Function | () => document.body | |
There was a problem hiding this comment.
这个从其他组件copy过来的 忘记改了
|
ci挂了？ |
|
feature branch |
|
想知道为什么在tooltipVisible=true的情况下 会挂在body上？ 如果不放在body上 是不是就不需要getTooltipPopupContainer这个了。 |
|
默认 popup 都在 body 上，是为了防止样式影响以及如果父容器有 |
|
🤔 This is a ...
👻 What's the background?
close #13416
close #13418
close #16669
💡 Solution
📝 Changelog
☑️ Self Check before Merge
IssueHunt Summary
Referenced issues
This pull request has been submitted to: