Introduction

Using react swipeable is easy! Follow the simple steps below:

1. Import useSwipeable hook from react-swipeable
2. Set the swipe handlers you care about
3. Spread the handlers onto an html tag to bind to the events

import { useSwipeable } from 'react-swipeable';

const handlers = useSwipeable({
    onSwiped: (eventData) => console.log("User Swiped!", eventData),
  ...config,
});
return <div {...handlers}> You can swipe here </div>;

Spread handlers onto the element you wish to track swipes on.

Swipe Demo

Swipe within this box to test the useSwipeable hook. Open the browser console window to see the event details.

🔮 Which way did you swipe? 🔮