✅P207_商城业务-商品详情-详情页渲染
大约 3 分钟
cfmall-product/src/main/resources/templates/item.html
详情页渲染
加入Thymeleaf名称空间
cfmall-product/src/main/resources/templates/item.html
<html lang="en" xmlns:th="http://www.thymeleaf.org">
渲染标题
th:text="${item.skuInfo.skuTitle}"
th:text="${item.skuInfo.skuSubtitle}"
默认图片展示
th:src="${item.skuInfo.skuDefaultImg}"
价格显示
整数保留3位,小数保留2位
th:text="${#numbers.formatDecimal(item.skuInfo.price,3,2)}"
有货无货信息显示
cfmall-product/src/main/java/com/gyz/cfmall/product/vo/SkuItemVo.java
/**
* 6、是否有货
*/
private boolean hasStock = true;
th:text="${item.hasStock?'有货':'无货'}"
所有图片的展示
<li th:each="image:${item.images}" th:if="${!#strings.isEmpty(image.imgUrl)}"><img th:src="${image.imgUrl}"/></li>
渲染销售属性
cfmall-product/src/main/resources/templates/item.html
th:each="attrValue:${item.saleAttr}"
[[${attrValue.attrName}]]
th:each="val:${#strings.listSplit(attrValue.attrValues,',')}"
将下方红框中的两个div代码片段注释掉,
商品描述
cfmall-product/src/main/resources/templates/item.html
th:src="${item.desc.decript}"
规格参数显示
去除超链接否则跳转出错
th:each="group:${item.groupAttrs}"
th:text="${group.groupName}"
th:each="attr:${group.attrs}"
th:text="${attr.attrName}"
th:text="${attr.attrValue}"
去除上方代码片段之后多余的<div class="guiGe">
,一直到包装清单为止,