Как заменить последний элемент в v-stepper?

Для замены последнего элемента в v-stepper можно изменить его содержимое с помощью слотов. Вам нужно будет найти соответствующий шаг v-stepper, и заменить его содержимое.

Пример:

```html
<template>
  <v-stepper v-model="step">
    <v-stepper-header>Step 1</v-stepper-header>
    <v-stepper-content>Step 1 content</v-stepper-content>
    
    <v-stepper-header>Step 2</v-stepper-header>
    <v-stepper-content>Step 2 content</v-stepper-content>
    
    <v-stepper-header>Step 3</v-stepper-header>
    <v-stepper-content>Step 3 content</v-stepper-content>
      <v-stepper-header>
        <template v-slot:default="{ index, step }">
          <v-stepper-step :complete="step > index">Step 4</v-stepper-step>
        </template>
      </game-stepper-header>
    <v-stepper-content>
       Step 4 content
    </v-stepper-content>
  </v-stepper>
</template>
```

Чтобы заменить кнопку "next" на кнопку "submit" в последнем шаге v-stepper, можно использовать слот `actions` в компоненте v-stepper. В этом слоте можно создать условие, чтобы в последнем шаге отображалась кнопка "submit".

Пример:

```html
<template>
  <v-stepper v-model="step">
    <v-stepper-header>Step 1</v-stepper-header>
    <v-stepper-content>Step 1 content</v-stepper-content>
    
    <v-stepper-header>Step 2</v-stepper-header>
    <v-stepper-content>Step 2 content</v-stepper-content>
    
    <v-stepper-header>Step 3</v-stepper-header>
    <v-stepper-content>Step 3 content</v-stepper-content>
    
    <v-stepper-header>Step 4</v-stepper-header>
    <v-stepper-content>Step 4 content</v-stepper-content>
    
    <v-stepper-header>
      <template v-slot:actions="{ index }">
        <v-btn @click="submit">Submit</v-btn>
      </template>
    </v-stepper-header>
  </v-stepper>
</template>
```

Таким образом, вы можете заменить последний элемент в v-stepper и изменить кнопку в последнем шаге на кнопку "submit".

Смотрите документацию  
 
 Playground Vuetify 
 
<template>
  <v-app>
    <v-container>
      <v-stepper v-model="step" :items="items">
        <!--...-->
        <template v-slot:item.3>
          <!-- Последний item-->
          <!--...-->
        </template>

        <template v-slot:next>
          <v-btn @click="nextOrSubmit" :disabled="false">
            {{ isLastItem ? 'Submit' : 'Next' }}
          </v-btn>
        </template>
      </v-stepper>
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref, reactive, computed } from 'vue'

  const items = reactive(['Название и авторы', 'Описания', 'Изображение'])
  const step = ref(1)

  const isLastItem = computed(() => step.value === items.length)

  const nextOrSubmit = () => {
    if (isLastItem.value) {
      // submit
      alert('submit')
      return
    }
    step.value++
  }
</script>