maxmarinich / react-alice-carousel

React responsive component for building content galleries, content rotators and any React carousels
MIT License
832 stars 91 forks source link

Slider not moving #309

Closed Jisha235 closed 7 months ago

Jisha235 commented 7 months ago

I have tried implementing alice-carousel. The buttons hide and show when it's the start or end of the item list but the items are not moving. On clicking the default button controls, they move but my custom button does not. I would like to get some feedback on this and my code if I have missed something.

`import React, {useState} from "react"; import AliceCarousel from "react-alice-carousel"; import HomeSectionCard from "../HomeSectionCard/HomeSectionCard"; import { Button } from "@mui/material"; import KeyboardArrowLeftIcon from "@mui/icons-material/KeyboardArrowLeft";

const HomeSectionCarousel = ({data}) => { const[activeIndex, setActiveIndex] = useState(0); const responsive = { 0: { items: 1 }, 720: { items: 3 }, 1024: { items: 5 }, };

const slidePrev = () => setActiveIndex(activeIndex-1); const slideNext = () => setActiveIndex(activeIndex+1);

// this will tell which index is active currently. const syncActiveIndex = ({item}) => setActiveIndex(item)

const items = data.slice(0,10).map((item) => ); return (

{activeIndex !== items.length-5 && } {activeIndex !== 0 && }

); };

export default HomeSectionCarousel; `