使用thymeleaf渲染轮播图

最新推荐文章于 2024-05-04 00:49:12 发布

奥普特

最新推荐文章于 2024-05-04 00:49:12 发布

阅读量1.6k

点赞数 1

分类专栏：笔记 JavaWeb 文章标签： java

本文链接：https://blog.csdn.net/weixin_45139292/article/details/117509969

版权

本文介绍如何利用Thymeleaf模板引擎，结合Bootstrap框架，将后台Java获取的图片URL动态渲染到HTML轮播图中。关键在于使用`th:classappend`根据当前指标设置图片的激活状态（active）。核心代码简洁高效，对于理解和实践Thymeleaf与前端交互具有参考价值。

摘要由CSDN通过智能技术生成

使用bootstrap的轮播图

使用thymeleaf模板引擎，将从后台取到的数据渲染到HTML前端页面。

	轮播的图片存储在数据库中，表名为banner，两个字段，id和url.
	![banner表](https://img-blog.csdnimg.cn/20210603095706150.png#pic_center)

Controller控制器：

		//创建BannerDao
        BannerDao bd = new BannerDao();
        List<Banner> banners = bd.findAll();
       //创建context对象
        Context context = new Context();  
        //将集合中的数据装进context容器
        context.setVariable("banners",banners);
        ThUtils.print("home.html",context,response);

dao层的查询所有方法：

public List<Banner> findAll() {
   
        List<Banner> list = new ArrayList<>();
        try {
   
            conn = JDBCUtils.getConnection();
            String sql = "select * from banner";
            pstm = conn.prepareStatement(sql);
            rs = pstm.executeQuery();
            while (rs.next()){
   
                int id = rs.getInt("id");
                String url = rs.getString("url");
                list.add(new Banner(id,url));
            }
            return list;
        } catch (SQLException e)