讲师列表前端实现

最新推荐文章于 2021-10-04 16:59:18 发布

创造1024组合成员杨抄阅

最新推荐文章于 2021-10-04 16:59:18 发布

阅读量326

点赞数

分类专栏：项目

本文链接：https://blog.csdn.net/weixin_35969228/article/details/106006048

版权

一.讲师列表前端实现

1.添加路由

{
    path: '/teacher',
    component: Layout,
    redirect: '/teacher/table',
    name: '讲师管理',
    meta: { title: '讲师管理', icon: 'example' },
    children: [
      {
        path: 'table',
        name: '讲师列表',
        component: () => import('@/views/edu/teacher/list'),
        meta: { title: '讲师列表', icon: 'table' }
      },
      {
        path: 'save',
        name: '添加讲师',  
        component: () => import('@/views/edu/teacher/save'),
        meta: { title: '添加讲师', icon: 'tree' }
      },
      {
        path: 'edit/:id',   
        name: 'EduTeacherEdit',
        component: () => import('@/views/edu/teacher/save'),
        meta: { title: '编辑讲师', noCache: true },
        hidden: true
      }
    ]
  },

2.创建路由对应页面

list代表列表，save代表添加，修改路由中的路径为@/views/edu/teacher/list

   component: () => import('@/views/edu/teacher/list'),

3.在api文件夹中创建teacher.js文件，在里面定义访问接口的地址

import request from '@/utils/request'
//引入了util中的request，request封装了axios

export default{
     //讲师列表带分页(当前页，每页记录数，条件对象)
     getTeacherListPage(current,limit,teacherQuery){
        return request({
            //url: '/table/list',
            url:`/eduservice/teacher/pageTeacher/${current}/${limit}`,
            method: 'post',
            //teacherQuery条件对象，后端使用RequestBody获取数据
            //data表示把对象转换成json进行传递到接口里面