通过bean保存商品,将商品列表从index_exam中传到show_exam页面并进行展示
时间: 2024-09-23 14:14:12 浏览: 19
在Web开发中,通常使用豆(Bean)来持久化数据,特别是在使用Spring框架时。假设我们有一个代表商品的实体类`Product`,它包含了商品的基本信息如ID、名称、价格等。为了在前后端交互中保存和显示商品列表,可以按照以下步骤操作:
1. **创建数据库表和Product Bean**:
- 在数据库中设计一个`products`表,用于存储商品数据。
- 定义一个`Product.java`类,对应数据库中的表结构,实现`Product`接口或继承`ProductBase`抽象类。
```java
public interface Product {
// 商品属性字段和getter/setter方法
}
// 或者
public abstract class ProductBase {
private int id;
private String name;
private double price;
// 省略getter和setter方法
}
```
2. **服务层处理商品数据**:
- 创建一个`ProductService`,负责从数据库获取商品列表,以及将单个商品保存到数据库。
```java
@Service
public class ProductService {
@Autowired
private ProductRepository productRepository; // 使用JPA或MyBatis等库连接数据库
public List<Product> getAllProducts() {
return productRepository.findAll();
}
public void saveProduct(Product product) {
productRepository.save(product);
}
}
```
3. **Controller接收请求并转发数据**:
- `IndexExamController`获取商品列表并将其传递给`ShowExamController`。
- 使用Thymeleaf、JSP或其他模板引擎,将产品列表渲染到前端页面`show_exam.html`。
```java
@Controller
public class IndexExamController {
@Autowired
private ProductService productService;
@GetMapping("/exam/index")
public String index(@ModelAttribute("products") Product[] products) {
products = productService.getAllProducts(); // 获取商品列表
return "redirect:/exam/show?products=" + Arrays.toString(products); // 转发到show_exam页面并附加参数
}
}
@Controller
@RequestMapping("/exam/show")
public class ShowExamController {
@ModelAttribute("products")
public List<Product> getProductsFromRequest(HttpServletRequest request) {
String productsStr = request.getParameter("products");
return Arrays.asList((Product[]) JSON.parseArray(productsStr, Product.class)); // 解析字符串为商品列表
}
@GetMapping
public String show(List<Product> products) {
// 将产品列表渲染到页面
return "show_exam";
}
}
```
4. **前端展示**:
- 在`show_exam.html`中,利用JavaScript遍历`products`列表,并显示商品名称、价格等信息。
```html
<ul>
<li th:each="product : ${products}">
<span>Name: </span><span th:text="${product.name}"></span><br>
<span>Price: </span><span th:text="${product.price}"></span><br>
</li>
</ul>
```