splide
splide copied to clipboard
Splide React will break down by wheel after change viewport when set breakpoints
Checks
- [X] Not a duplicate.
- [X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions
Version
@splidejs/react-splide v0.7.12
Description
I have config like below, splide will break down after change viewport and wheel.
<Splide
aria-label="characters"
hasTrack={false}
options={{
// gap: "1rem",
type: "loop",
perPage: 3,
focus: "center",
padding: "15%",
waitForTransition: true,
wheel: true,
speed: 1000,
updateOnMove: true,
arrows: true,
pagination: false,
breakpoints: {
1400: {
perPage: 2,
padding: "22%",
},
1200: {
perPage: 2,
padding: "12%",
}
},
}}
onMove={(splide, index, prev, dest) => {
setPinsRotateAngel(-Pins.angle_unit * index)
setCurrIndex(index + 1)
}}
>
<SplideTrack>
{Array.from(Array(total)).map((e, i) => (
<SplideSlide key={`slide-${i}`}>
<h1>slide {i}</h1>
</SplideSlide>
))}
</SplideTrack>
</Splide>
Reproduction Link
No response
Steps to Reproduce
- create splide react component, must write
onMove
event and include a setState function: - open broswer, making it's width bigger than 1400
- change broswer width smaller than 1200
- wheel your mouse
- break down...
Expected Behaviour
splide runs normally