后端 @RequestParam接收 vue前端怎么请求

在 Vue 前端中，可以使用 Axios 或者 Fetch 等 HTTP 请求库来向后端发送请求。以下是使用 Axios 发送 GET 请求并带上参数的示例代码：

import axios from 'axios';

axios.get('/api/endpoint', {
  params: {
    param1: 'value1',
    param2: 'value2'
  }
}).then(response => {
  console.log(response.data);
}).catch(error => {
  console.error(error);
});

其中，`/api/endpoint` 是后端的接口地址，`params` 是 GET 请求的参数，key-value 形式的对象。后端使用 `@RequestParam` 注解来接收这些参数。

相关问题

public JsonData login(@RequestParam(required = true) String username, @RequestParam(required = true) String password)，前端vue访问报错: Required String parameter 'username' is not present，这是为什么

这个错误提示说明前端发送的POST请求中缺少了`username`参数，导致后端无法接收到该参数。

可能的原因是前端发送的请求格式不正确或者参数名写错了。可以检查一下前端发送的请求是否包含了`username`参数，以及该参数的名称是否正确。

此外，也可以检查一下后端的代码是否正确，比如是否使用了`@RequestParam`注解来接收请求参数，参数名称是否与前端发送的请求一致等。建议在后端代码中添加日志输出，方便查看请求的详细信息，例如：

@PostMapping("/login")
public JsonData login(@RequestParam(required = true) String username, @RequestParam(required = true) String password) {
    log.info("Received login request with username: {}", username);
    // 处理登录逻辑
    // ...
}

这样，在控制台中就可以看到每个请求的详细信息，方便定位问题。

多个@RequestParam

多个@RequestParam是指在后端接收前端传递的多个参数时，可以使用多个@RequestParam注解来指定每个参数的名称。这样后端就可以根据这些注解来获取对应的参数值。使用多个@RequestParam时，如果前端没有提供相应的参数，后端会报错并提示所需参数不存在。如果需要在后端接收参数时不报错，可以使用request.getParameter("xxx")来接收参数，这样即使前端没有提供相应的参数，后端会得到一个空值，而不会报错。在使用vue进行get请求时，参数可以通过拼接在url中的方式传递给后端。<em>1</em><em>2</em><em>3</em>
#### 引用[.reference_title]
- *1* *2* [@RequestBody总结相关](https://blog.csdn.net/qq_35946055/article/details/105047874)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}} ] [.reference_item]
- *3* [后端参数接收之@RequestParam](https://blog.csdn.net/wuniangzhanyan/article/details/112574680)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}} ] [.reference_item]
[ .reference_list ]