我正在使用 VueJS 做一个项目,我需要以下内容:
使用 API 并获取主页中的用户列表。
当单击用户的按钮时,我需要重定向到另一个组件并在该组件中输出该用户的详细信息(仅我单击的用户的详细信息)。
这是显示用户信息的表格
<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> make payment
</v-btn>
</td>
</template>
<template v-slot:no-results>
<h6 class="grey--text">No data available</h6>
</template>
</v-data-table>
视图函数在方法中
view() {
window.open(`/finance/pay-doctors/${item.id}`, "_blank");
},
我创建了一条动态路线
{ path: '/finance/pay-doctors/:id', component: DoctorDetails}
无法创建 DoctorDetails 并显示数据
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
我建议您首先尝试使用路由器推送。
因此请使用
<script> export default { methods: { view(id) { this.$router.push({ path: `/finance/pay-doctors/${item.id}` }) } } } </script>确保您的路由器已正确设置+感谢您的 Vue 开发工具,您拥有正确的状态。
此外,请确保在
DoctorDetails上有一些东西可以获取用户的数据。