Je travaille sur un projet utilisant VueJS et j'ai besoin des éléments suivants :

Utilisez l'API et obtenez la liste des utilisateurs sur la page d'accueil.

Lorsque l'on clique sur le bouton d'un utilisateur, je dois rediriger vers un autre composant et afficher les détails de cet utilisateur (uniquement les détails de l'utilisateur sur lequel j'ai cliqué) dans ce composant.

Ceci est un tableau affichant les informations utilisateur

 <v-data-table hide-actions flat :headers="headers" :items="doctors">
        <template v-slot:items="props">
          <td>{{ props.index + 1 }}</td>
          <td>{{ props.item.profile.full_name }}</td>
          <td>{{ props.item.email }}</td>
          <td>{{ props.item.username }}</td>
          <td>{{ props.item.updated_at }}</td>
         <td> 
          <v-btn outline small color="indigo" @click="view(props.item)">
                                <i class="fa fa-eye"></i> &nbsp; make payment
                            </v-btn>
         </td>


        </template>
        <template v-slot:no-results>
          <h6 class="grey--text">No data available</h6>
        </template>
      </v-data-table>

Fonction Afficher dans la méthode

 view() {
            window.open(`/finance/pay-doctors/${item.id}`, "_blank");
        },

J'ai créé un parcours dynamique

 { path: '/finance/pay-doctors/:id', component: DoctorDetails}

Impossible de créer DoctorDetails et d'afficher les données