test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 11:39:28 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity

fix: Slider's Tooltip should not blink, close: #5003

Browse Source
This commit is contained in:
Benjy Cui 2017-02-23 17:03:18 +08:00
parent 1c837963e2
commit 1f844c1048
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/slider/index.tsx
View File

@ -43,30 +43,36 @@ export default class Slider extends React.Component<SliderProps, any> {
constructor(props) {
super(props);
this.state = { visibles: {} };
this.state = {
visibles: {},
};
}
handleTooltipVisibleChange = (index, visible) => {
this.setState({
toggleTooltipVisible = (index, visible) => {
this.setState(({ visibles }) => ({
visibles: {
...this.state.visibles,
...visibles,
[index]: visible,
},
});
}));
}
handleWithTooltip = ({ value, dragging, index, ...restProps }) => {
const { tooltipPrefixCls, tipFormatter } = this.props;
const { visibles } = this.state;
return (
<Tooltip
prefixCls={tooltipPrefixCls}
title={tipFormatter ? tipFormatter(value) : ''}
visible={tipFormatter && (this.state.visibles[index] || dragging)}
onVisibleChange={visible => this.handleTooltipVisibleChange(index, visible)}
visible={tipFormatter && (visibles[index] || dragging)}
placement="top"
transitionName="zoom-down"
key={index}
>
<RcHandle {...restProps} />
<RcHandle
{...restProps}
onMouseEnter={() => this.toggleTooltipVisible(index, true)}
onMouseLeave={() => this.toggleTooltipVisible(index, false)}
/>
</Tooltip>
);
}