Questions tagged [v-stepper]
11 questions
11
votes
4 answers
VuetifyJS: how to get rid of the v-stepper component elevation?
When using the v-stepper component in Vuetify, there is a default border like shape that appears on the edges:
I want to remove it. I tried to set the elevation to 0 but it did not work.
Codepen
How…

Billal Begueradj
- 20,717
- 43
- 112
- 130
10
votes
2 answers
Dynamically integrate Vuetify v-stepper with Vue router
I would like to integrate vuetify's v-stepper with vue router. My requirements are as follows:
Each step has its own route (e.g. /myform/step1, /myform/step2, /myform/step3, etc)
Each step is component on its own which is dynamically loaded…

Frank
- 1,374
- 2
- 16
- 34
2
votes
2 answers
How to change the v-stepper icon size inside the steps?
I want to change the Icon size inside the v-stepper steps. I could manage to change the step sizes. But cannot find a way to change the icon size.

Namudara Abeysinghe
- 23
- 6
1
vote
1 answer
VuetifyJS: How to make v-stepper-header sticky on scroll
I'm looking for a way to make the component sticky on scroll.
I've tried to create custom CSS but didn't succeed.
Here's a sample code.

Carol-Theodor Pelu
- 906
- 2
- 10
- 26
0
votes
1 answer
How to share data variables between child components
I have parent component addUser.vue and it contains v-stepper and I want to refactor v-stepper-content into couple of child components StepperOne.vue, StepperTwo.vue, StepperThree.vue like this
adddUser.vue
…

Killian Pierce
- 121
- 3
- 12
0
votes
1 answer
Vuetify.js: how to cancel v-stepper-step header click when active form is invalid
I'm using a v-stepper from Vuetify.
What I want is:
when the user click on a stepper step (in the header) I block the click event if the active form isn't valid
I've managed to do so but by setting the click listener on the span…

Cyril F
- 1,842
- 2
- 19
- 35
0
votes
1 answer
Vue: triggering a method when choosing another step in the stepper
Let us say that we have following steps in the stepper:
Home > Purchase > Comments > Settings
Template:
user17350567
0
votes
1 answer
How to make v-stepper-step size large in Vuetify?
This is the Stepper image . View it !!
How can I change this icon/ step circle size in v-stepper ??

Namudara Abeysinghe
- 23
- 6
0
votes
0 answers
Vuetify V-Stepper Card/Content automatic scroll up when goes to next slide
Hi I'm doing my project with Vuejs 2 and Vuetify and one page uses v-stepper component for steps so it goes to next slide or go back. The Problem that I have is when I go to the next slide the card/content won't scroll up, so user has to manually…

Killian Pierce
- 121
- 3
- 12
0
votes
1 answer
How can I access a property of a step component from the parent page of a Vue stepper?
Not very experienced with Vue, and am struggling to fix an issue with an existing component made by a previous developer.
On the parent page, the stepper component is declared like this, with these as the names of the sub-components that make up the…

Bob Tway
- 9,301
- 17
- 80
- 162
0
votes
2 answers
Vuetifyjs: how to make the v-stepper's step clickable?
Using the v-stepper component, is there a way to make the steps respond to clicks?
P.S. On the link I provided, there is a Codepen example. It is a link to the official documentation so that example is always there.

Billal Begueradj
- 20,717
- 43
- 112
- 130