How can I skip steps in QStepper?
-
How can I make it so a user can click on any step in the Qstepper? For example, they are on step 1 and they want to skip to step 4. (Basically the same way it already works going backwards, but allowing forward navigation)
-
You could use model binding to achieve that: http://quasar-framework.org/components/stepper.html#Using-v-model
-
I understand how to use v-model to switch between steps programmatically, but I guess I’m confused about how to add a click event to the step header. I tried using @click on the QStep to goto the named step, but that didn’t seem to work (though I can make a button with the same code and it will go to the desired step)
-
Take a look at the demo and its source code. It has an example. Highlighting the most important part: https://github.com/quasarframework/quasar-play/blob/dev/src/pages/showcase/grouping/stepper.vue#L27-L30