用springboot写一个表格第一行照片 姓名 年龄 荣誉 第二行图片 111 98 000 第三行 图片 222 62 000 第四行图片 333 93 000
时间: 2024-09-14 13:10:51 浏览: 26
在Spring Boot中,我们可以结合Thymeleaf这样的模板引擎来渲染HTML表格,按照您的描述,可以创建一个简单的表格结构。假设有一个`User`对象的数据源,每个对象包含照片、姓名、年龄和荣誉。以下是一个步骤:
1. 首先,创建一个`User`类,用于表示用户信息:
```java
public class User {
private String photoUrl;
private String name;
private int age;
private String honor;
// 构造函数,getter和setter
}
```
2. 在`UserService`或者类似的地方,提供数据:
```java
import java.util.ArrayList;
import java.util.Arrays;
public class UserService {
public List<User> getUsers() {
List<User> userList = new ArrayList<>();
userList.add(new User("照片URL1", "姓名1", 111, "荣誉1"));
userList.add(new User("照片URL2", "姓名2", 62, "荣誉2"));
userList.add(new User("照片URL3", "姓名3", 93, "荣誉3")); // 省略第四行代码
return userList;
}
}
```
3. 在`UserController`中注入`UserService`并提供视图:
```java
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.ui.Model;
@RestController
public class UserController {
@Autowired
private UserService userService;
@GetMapping("/users")
public String showUsers(@ModelAttribute("users") List<User> users, Model model) {
model.addAttribute("users", users);
return "users-table"; // 引用对应的HTML模板
}
}
```
4. 在`users-table.html`(Thymeleaf模板)文件中创建表格:
```html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<!-- ... -->
</head>
<body>
<table border="1">
<thead>
<tr>
<th>照片</th>
<th>姓名</th>
<th>年龄</th>
<th>荣誉</th>
</tr>
</thead>
<tbody>
<tr th:each="user : ${users}">
<td><img th:src="${user.photoUrl}" alt="用户头像" /></td>
<td th:text="${user.name}"></td>
<td th:text="${user.age}"></td>
<td th:text="${user.honor}"></td>
</tr>
</tbody>
</table>
</body>
</html>
```
现在每次访问`/users`路径,就会渲染出这样的表格。
阅读全文