书写使用springboot和Vue写学生选课系统的代码

由于代码量较大，无法在此处完整展示，以下是一个简单的实现过程：

1. 后端使用SpringBoot框架搭建RESTful API，提供数据接口，主要包括学生信息、课程信息、选课信息等。
2. 前端使用Vue框架进行开发，主要包括登录、注册、选课、退课、查看选课情况等功能。
3. 连接后端和前端，实现数据的交互和展示。

以下是一个简单的示例代码：

后端代码（Java）：

@RestController
@RequestMapping("/api")
public class CourseController {

    @Autowired
    private CourseService courseService;

    @GetMapping("/courses")
    public List<Course> getAllCourses() {
        return courseService.getAllCourses();
    }

    @PostMapping("/courses")
    public Course addCourse(@RequestBody Course course) {
        return courseService.addCourse(course);
    }

    @DeleteMapping("/courses/{id}")
    public void deleteCourse(@PathVariable Long id) {
        courseService.deleteCourse(id);
    }

    // 其他接口
}

前端代码（Vue）：

<template>
  <div>
    <h1>课程列表</h1>
    <table>
      <thead>
        <tr>
          <th>课程编号</th>
          <th>课程名称</th>
          <th>授课教师</th>
          <th>学分</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="course in courses" :key="course.id">
          <td>{{ course.id }}</td>
          <td>{{ course.name }}</td>
          <td>{{ course.teacher }}</td>
          <td>{{ course.credit }}</td>
          <td>
            <button @click="selectCourse(course.id)">选课</button>
            <button @click="dropCourse(course.id)">退课</button>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      courses: [],
    };
  },
  mounted() {
    axios.get('/api/courses')
      .then(response => {
        this.courses = response.data;
      })
      .catch(error => {
        console.log(error);
      });
  },
  methods: {
    selectCourse(id) {
      // 发送选课请求
    },
    dropCourse(id) {
      // 发送退课请求
    },
  },
};
</script>

以上代码仅为示例，实际开发中还需要考虑安全性、异常处理、数据校验等问题。