Add callback for swiper zoom change
This commit is contained in:
parent
5637327e8a
commit
71b9cace53
1 changed files with 14 additions and 4 deletions
|
@ -196,6 +196,19 @@ export const SwiperGridCarousel = ({
|
|||
[slidesPerView],
|
||||
);
|
||||
|
||||
const handleOnZoomChange = useCallback(
|
||||
(e: SwiperCore) => {
|
||||
const { slides, isEnd, isBeginning } = e;
|
||||
if (isEnd || isBeginning) return;
|
||||
|
||||
setPagination({
|
||||
hasNextPage: slidesPerView < slides.length,
|
||||
hasPreviousPage: slidesPerView < slides.length,
|
||||
});
|
||||
},
|
||||
[slidesPerView],
|
||||
);
|
||||
|
||||
const handleOnReachEnd = useCallback(
|
||||
(e: SwiperCore) => {
|
||||
const { slides } = e;
|
||||
|
@ -246,10 +259,6 @@ export const SwiperGridCarousel = ({
|
|||
)}
|
||||
<Swiper
|
||||
ref={swiperRef}
|
||||
grid={{
|
||||
fill: 'column',
|
||||
rows: 2,
|
||||
}}
|
||||
modules={[Virtual]}
|
||||
slidesPerView={swiperProps?.slidesPerView || slidesPerView || 5}
|
||||
spaceBetween={20}
|
||||
|
@ -260,6 +269,7 @@ export const SwiperGridCarousel = ({
|
|||
onReachBeginning={handleOnReachBeginning}
|
||||
onReachEnd={handleOnReachEnd}
|
||||
onSlideChange={handleOnSlideChange}
|
||||
onZoomChange={handleOnZoomChange}
|
||||
{...swiperProps}
|
||||
>
|
||||
{slides.map((slideContent, index) => {
|
||||
|
|
Reference in a new issue