Custom Buttons

Customise the label and icons on every tour button.

Custom Buttons

Pass a ButtonConfig object to any of the four button props to change its label and icons:

  • next-button — nextButton
  • skip-button — skipButton
  • prev-button — prevButton
  • finish-button — finishButton

ButtonConfig props

labelstring
Button label text.
leftIconstring
Icon name displayed to the left of the label.
rightIconstring
Icon name displayed to the right of the label.
Icon names
Any icon from Icones is supported. Copy the full icon name including the collection prefix (e.g. heroicons:arrow-right).

Autostart

Start a tour automatically when the component mounts by passing the auto-start prop.

Callbacks & Emits

Listen to tour lifecycle events with Vue emits.