【项目实战】---商品详情页的制作

最新推荐文章于 2023-12-25 20:25:59 发布

画面很美

最新推荐文章于 2023-12-25 20:25:59 发布

阅读量2.6k

点赞数 2

本文链接：https://blog.csdn.net/gfjjggg/article/details/84010498

版权

分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow

也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！

在前面的博文中，小编分别简单的介绍了邮件的发送以及邮件的激活，逛淘宝的小伙伴都有这样的体会，比如在搜索框中输入连衣裙这个商品的时候，会出现多种多样各种款式的连衣裙，连衣裙的信息包括价格，多少人购买，商品的名称等等，但是这些信息不够详情，我们需要了解更多的关于连衣裙的详情，点击某个商品，跳转页面，查看连衣裙的详情，以前小编逛淘宝的时候，从来都没有想过这个功能是如何实现，只知道一个劲儿的在那儿逛，小编现在接手的这个项目中就遇到这样的功能，点击商品跳转到某个商品的详情页面，这个功能该如何实现呢？不要着急，今天这篇博客，小编就简单的向小伙伴们介绍一下，如何点击商品跳转到详情页面，希望对有需求的小伙伴有所帮助，还请小伙伴多多指教哦`(*∩_∩*)′~~~

首先第一步，我们要找个某个商品的具体链接，传递商品的ID来进行查询，根据商品的ID来显示相对应的商品，我们要修改首页的超链接的路径。接着第二步，我们需要编写Action中的代码，首先编写Action类，继承ActionSupport实现模型驱动接口，具体代码如下所示：

package cn.itcast.shop.product.action;import cn.itcast.shop.product.service.ProductService;import cn.itcast.shop.product.vo.Product;import com.opensymphony.xwork2.ActionSupport;import com.opensymphony.xwork2.ModelDriven;/** * 商品的Action对象 * @author Flower * */public class ProductAction extends ActionSupport implements ModelDriven<Product> { //用于接收数据的模型驱动 private Product product = new Product(); //注入商品的Service private ProductService productService;  public void setProductService(ProductService productService) {  this.productService = productService; } public Product getModel() {  return product; }  //根据商品的ID进行查询商品：执行方法： public String findByPid(){  //调用Service的方法完成查询  product = productService.findByPid(product.getPid());    return "findByPid";   }}

第三步，需要配置Action，有两个地方需要进行配置工作，第一个在application.xml中配置Action，代码如下所示：

<!-- 商品模块的Action --> <bean id="productAction" class="cn.itcast.shop.product.action.ProductAction" scope="prototype">  <property name="productService" ref="productService"/> </bean>

第二个在struts.xml中配置Action；

<!-- 商品模块的Action -->  <action name="product_*" class="productAction" method="{1}">      <result name="findByPid">/WEB-INF/jsp/product.jsp</result>  </action>

第四步，我们需要在Action中调用service完成根据ID进行查询的方法，注入ProductService的方法，之后就是一些方法的调用，ProductService直接调用ProductDao里面的findByPid的方法，ProductDao直接返回即可。html页面布局代码如下图所示：

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><%@ taglib uri="/struts-tags" prefix="s" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-type" content="text/html; charset=UTF-8"/><title>网上商城</title><link href="${pageContext.request.contextPath}/css/common.css" rel="stylesheet" type="text/css"/><link href="${pageContext.request.contextPath}/css/product.