kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-04-24 04:15:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(slider): show animation at click event

Browse Source
This commit is contained in:
unix
2020-04-13 15:23:30 +08:00
parent 02c72db34f
commit 5920129920
2 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/slider/slider-dot.tsx
View File

@@ -51,7 +51,7 @@ const SliderDot = React.forwardRef<HTMLDivElement, React.PropsWithChildren<Slide
}
.dot.click {
transition: all 200ms ease 0;
transition: all 200ms ease;
}
.dot:hover {

7
components/slider/slider.tsx
View File

@@ -90,13 +90,15 @@ const Slider: React.FC<React.PropsWithChildren<SliderProps>> = ({
const offset = currentOffset + lastDargOffsetRef.current
updateValue(offset)
}
const dragStartHandler = () => setSliderWidth(getRefWidth(sliderRef))
const dragStartHandler = () => {
setIsClick(false)
setSliderWidth(getRefWidth(sliderRef))
}
const dragEndHandler = (event: DraggingEvent) => {
if (disabled) return
const offset = event.currentX - event.startX
const currentOffset = offset + lastDargOffsetRef.current
setLastDargOffset(currentOffset)
setIsClick(false)
}
const clickHandler = (event: React.MouseEvent<HTMLDivElement>) => {
if (disabled) return
@@ -104,6 +106,7 @@ const Slider: React.FC<React.PropsWithChildren<SliderProps>> = ({
setIsClick(true)
setSliderWidth(getRefWidth(sliderRef))
const clickOffset = event.clientX - sliderRef.current.getBoundingClientRect().x
setLastDargOffset(clickOffset)
updateValue(clickOffset)
}