Las diapositivas de Swiperjs no se deslizan correctamente.

Estoy usando swiperjs y tengo dificultades para hacer que las diapositivas se desplacen, ya que no se deslizan hacia la siguiente diapositiva y no puedo obtener el índice activo de ellas. Este es mi código:

¿Dónde me estoy equivocando? Estoy usando typescript y la versión 6.84 de swiperjs con el framework ionic.

import 'swiper/components/navigation/navigation.min.css';
import 'swiper/components/pagination/pagination.min.css';

const pagination = {
    clickable: true,
};

return (
    <ionpage>
        <swiper pagination="{pagination}" onbeforeslidechangestart="{(e)" ==""> {
                setIndex(e.activeIndex);
            }}
        >
            <swiperslide>
                <item property="{property}" index="{0}" save="{dispatch}" activeindex="{index}"></item>
            </swiperslide>
            <swiperslide>
                <item2 property="{property}" index="{1}"></item2>
            </swiperslide>
            <swiperslide>
                <item3 property="{property}" index="{1}"></item3>
            </swiperslide>
        </swiper>
        <ionbutton disabled="{true}" onclick="{(e)" ==""> {
                e.preventDefault();
            }}
            className={"next"}
            expand={"block"}
        >
            Save
        </ionbutton>
    </ionpage>
);