一、前端实现

1、组件模板

  1. <!-- 课程讲师 -->
  2. <el-form-item label="课程讲师">
  3.   <el-select
  4.     v-model="courseInfo.teacherId"
  5.     placeholder="请选择">
  6.     <el-option
  7.       v-for="teacher in teacherList"
  8.       :key="teacher.id"
  9.       :label="teacher.name"
  10.       :value="teacher.id"/>
  11.   </el-select>
  13. </el-form-item>

2、定义api

api/edu/teacher.js

  1. getList() {
  2.    return request({
  3.        url: api_name,
  4.        method: 'get'
  5.    })
  7. },

组件中引入teacher api

  1. import teacher from '@/api/edu/teacher'

3、组件脚本

  2. //定义data
  4. teacherList: [] // 讲师列表
  6. //表单初始化时获取讲师列表
  9. init() {
  10.    ......
  11.    // 获取讲师列表
  12.    this.initTeacherList()
  14. },
  16. initTeacherList() {
  17.   teacher.getList().then(response => {
  18.     this.teacherList = response.data.items
  19.   })
  21. },