页面1
<template v-slot="{ row }">
<el-button type="text" size="mini" @click="$router.push(`/employee/detail/${row.id}`)" >查看 </el-button>
</template>
页面2
userInfo: {
username: "",
mobile: "",
formOfEmployment: null,
workNumber: "",
departmentId: null,
timeOfEntry: "",
correctionTime: "",
staffPhoto: "",
},
//这里根据传递过来的id,来掉接口,如果没有id,不发请求
created() {
if (this.$route.params.id) {
this.getEmployeeDetail();
}
},
methods: {
async getEmployeeDetail() {
this.userInfo = await getEmployeeDetail(this.$route.params.id);
},
}
路由页面
import layout from "@/layout";
export default {
path: "/employee",
component: layout,
children: [
{
path: "",
name: "employee",
component: () => import("@/views/employee"),
meta: {
title: "员工",
icon: "people",
},
},
{
// 员工详情的地址 这里:id?是为了跳转时携带id,在有没有id的情况下都能符合要求去跳转
path: "/employee/detail/:id?",
component: () => import("@/views/employee/detail.vue"),
meta: {
title: "员工详情", // 显示在导航的文本
},
hidden: true, // 表示隐藏在左侧菜单
},
],
};