@GetMapping("/search") public Result Search(@RequestParam String search){ System.out.println(search); List<Music> list = musicService.Search(search); if(list != null){ return Result.success(list); } return Result.success("没有找到此歌曲"); }
时间: 2024-03-23 10:37:10 浏览: 19
根据您提供的代码来看,后端使用了 `@RequestParam` 注解来获取 GET 请求中的参数。在前端发送 GET 请求时,可以通过 URL 的查询参数来传递参数,例如:
```
this.$http.get('/api/music/search?search=your_search_keyword')
```
上面的代码中,查询参数中包含名为 `search` 的参数,它的值为 `your_search_keyword`。
如果您需要在 Vue 中动态地设置查询参数,可以使用对象的方式来传递参数。例如:
```
this.$http.get('/api/music/search', {
params: {
search: 'your_search_keyword'
}
})
```
上面的代码中,使用对象 `{ params: { ... } }` 来传递查询参数,其中 `search` 是参数名,`your_search_keyword` 是参数值。
希望这些信息对您有所帮助。
相关问题
@GetMapping("/search") public List<Music> Search(@RequestParam String search){ System.out.println(search); List<Music> list = musicService.Search(search); return list; }
这是一个使用Spring Boot框架的Java后端代码,其中的@GetMapping("/search")表示这是一个处理HTTP GET请求,路径为"/search"的方法。@RequestParam String search表示从HTTP请求中获取名为"search"的参数,并将其作为String类型的变量传递给方法。代码中打印出了获取到的"search"参数,然后调用musicService的Search方法,该方法会根据搜索关键字查询数据库中的音乐信息,并返回一个包含音乐信息的列表。最后,返回这个列表,将其转换成JSON格式并返回给HTTP请求的发起方。
这段代码总是报500的错误,给出修改代码<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>民航系统</title> </head> <body> <h1>航班查询</h1> <form action="/flightQuery" method="get"> <label for="flightNum">航班号:</label> <input type="text" id="flightNum" name="flightNum"><br><br> <button type="submit">查询</button> </form> <br><br> <div th:if="${flightDO != null}"> <p>航班公司:[[${flightDO.company}]]</p> </div> </body> </html>@GetMapping("/flightQuery") public FlightDO queryFlight(@RequestParam("flightNum") String flightNum) { FlightDO flightDO = adminService.query(flightNum); return flightDO; }
根据你提供的代码,我看到你在前端页面只传递了一个参数 `flightNum`,但是在后端的方法中接收了两个参数 `flightNum` 和 `date`。这可能是导致 500 错误的原因之一。
因此,你需要在前端页面中添加一个日期选择器,并将其对应的值也传递到后端。
以下是修改后的前端页面代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>民航系统</title>
</head>
<body>
<h1>航班查询</h1>
<form action="/flightQuery" method="get">
<label for="flightNum">航班号:</label>
<input type="text" id="flightNum" name="flightNum"><br><br>
<label for="date">日期:</label>
<input type="date" id="date" name="date"><br><br>
<button type="submit">查询</button>
</form>
<br><br>
<div th:if="${flightDO != null}">
<p>航班公司:[[${flightDO.company}]]</p>
</div>
</body>
</html>
```
在后端的代码中,也需要将方法的参数列表修改为仅接收一个 `flightNum` 参数:
```java
@GetMapping("/flightQuery")
public FlightDO queryFlight(@RequestParam("flightNum") String flightNum, @RequestParam("date") String date) {
FlightDO flightDO = adminService.query(flightNum, date);
return flightDO;
}
```
这样,就可以在前端页面中选择日期并将其值传递到后端了。同时,需要注意前端页面中日期选择器的 name 属性必须与后端代码中的 `@RequestParam` 注解中的参数名相同。
相关推荐
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![md](https://img-home.csdnimg.cn/images/20210720083646.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)