vue3+SpringBoot+postgresql 项目前后端传参

在Vue 3 + Spring Boot + PostgreSQL项目中，前后端传递参数通常涉及以下步骤：

前端（Vue 3）：

1. 定义API接口。
2. 使用axios或者其他HTTP客户端发送请求。
3. 绑定数据到请求参数。

后端（Spring Boot）：

1. 创建Controller类。
2. 定义请求处理方法。
3. 使用@RequestBody或@RequestParam等注解接收参数。

以下是一个简单的例子：

前端（Vue 3）：

// 使用axios发送POST请求
import axios from 'axios';
 
const postData = async (url = '', data = {}) => {
  const response = await axios.post(url, data);
  return response.data;
};
 
// 发送数据到后端
const sendData = async () => {
  const url = 'http://localhost:8080/api/data';
  const data = { key: 'value' };
  try {
    const result = await postData(url, data);
    console.log(result);
  } catch (error) {
    console.error(error);
  }
};
 
// 调用函数发送数据
sendData();

后端（Spring Boot）：

import org.springframework.web.bind.annotation.*;
 
@RestController
@RequestMapping("/api")
public class DataController {
 
  @PostMapping("/data")
  public String receiveData(@RequestBody Map<String, String> data) {
    // 处理接收到的数据
    String receivedValue = data.get("key");
    // 返回响应
    return "Received: " + receivedValue;
  }
}

在这个例子中，前端使用axios库发送一个POST请求，后端的Controller接收这个请求并处理。这里的@RequestBody注解用于将请求体中的JSON数据绑定到方法参数上。如果是表单数据或简单参数，可以使用@RequestParam注解。