Callbacks & Emits

Listen to tour lifecycle events with Vue emits.

Callbacks and Emits

VTour emits four events you can listen to. A notification fires on each one in the demo below.

Event reference

@tour:start() => void
Fired when the tour begins.
@tour:end() => void
Fired when the tour completes normally.
@tour:skip() => void
Fired when the user skips the tour.
@tour:step-change({ from: number, to: number }) => void
Fired on every step transition. Payload contains the previous (from) and next (to) step indices.

Custom Buttons

Customise the label and icons on every tour button.

useTour() composable

Control a tour from outside the component using the useTour() composable.