使用Springboot和vue框架，如何把前端数据通过点击按钮后添加到数据库中

首先，你需要在Spring Boot中定义一个RESTful API，用于接收前端传来的数据。可以使用Spring Boot提供的注解@RestController来简化这个过程。

在你的Controller中，你可以定义一个POST请求的方法，用于接收前端传来的数据。例如：

@PostMapping("/addData")
public ResponseEntity<String> addData(@RequestBody YourData data) {
    // 在这里处理数据，将其添加到数据库中
    return ResponseEntity.ok("Data added successfully");
}

其中，@PostMapping注解表示这个方法会接收POST请求，@RequestBody注解表示数据将会以JSON格式传递到这个方法中，YourData是你自己定义的数据模型，用于接收前端传来的数据。这个方法返回一个ResponseEntity对象，表示请求成功，并返回一个字符串。

接下来，在你的Vue组件中，你可以使用Axios库来发起一个POST请求，将数据发送到你的API中。例如：

import axios from 'axios';

// ...

axios.post('/addData', {
    // 这里是你要添加到数据库中的数据
}).then(response => {
    console.log(response.data);
}).catch(error => {
    console.error(error);
});

在这个例子中，我们使用Axios库发起了一个POST请求，将数据发送到了addData这个API中。注意，这里的URL应该和你的Spring Boot应用程序的URL相匹配。

这样，当用户在前端点击按钮后，前端会将相应的数据发送到后端，后端再将这些数据插入到数据库中。