在thymeleaf中使用th:each

最新推荐文章于 2023-05-20 11:02:10 发布

YANHuoQing

最新推荐文章于 2023-05-20 11:02:10 发布

阅读量961

点赞数

文章标签： layui javascript 前端

本文链接：https://blog.youkuaiyun.com/YANHuoQing/article/details/121515214

版权

这段代码展示了如何使用Thymeleaf模板引擎遍历后台传来的商店数据，为每个商店创建带有详细信息的div元素。每个div通过th:id绑定商店的id，th:src获取商店图片URL，th:text显示商店名称和价格。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div th:each="s:${shops}"  >
	<div th:id="${s.id}"  onclick="shopDetail(this.id)">
	    <div>
		    <img th:src="@{${s.shopImgs}}">
		</div>
	    <div >
		    <span th:text="@{${s.shopName}}" class="shopname" ></span>
			<span>￥
			    <span th:text="@{${s.shopMoney}}"></span>
			</span>
		</div>

	</div>
</div>

th:each="s:${shops}" ,shops是从后台获取的内容，th:id="${s.id}"是为div绑定id，值是循环后从s中获取到的id值。

th:src="@{${s.shopImgs}}"是图片的url.

th:text="@{${s.shopName}}"是显示的文本内容