v-onboarding v-onboarding

hooks

Hooks can be defined individually for each Step.

onBeforeStep

It runs before the step is 'opened'.

{
  on: {
    beforeStep: function (options) {
      // The logic written here will run before displaying the step, and it can be customized with settings
    }
  }
}
Option Name Type Default Description
index Number privateIndex The index of the current step, the first step being indexed as 0
step StepEntity activeStep The data and parameters of the current step
direction Number 1 or -1 -1 if we jump to a previous step in the order of steps; otherwise, 1.
isForward Boolean direction === Direction.FORWARD true if indeed the next element will appear
isBackward Boolean direction === Direction.BACKWARD true if in fact the previous element will be displayed

onAfterStep

It runs before the step is 'closed'.

{
  on: {
    afterStep: function (options) {
      // The logic written here will run before hiding the step, and it can be customized with settings
    }
  }
}
Option Name Type Default Description
index Number privateIndex The index of the current step, the first step being indexed as 0
step StepEntity activeStep The data and parameters of the current step
direction Number 1 or -1 -1 if we jump to a previous step in the order of steps; otherwise, 1.
isForward Boolean direction === Direction.FORWARD true if indeed the next element will appear
isBackward Boolean direction === Direction.BACKWARD true if in fact the previous element will be displayed
options
Default Slot