SpringBoot新闻头条浏览主页中完成新闻展示、搜索、分类、标签功能
接着上一篇博客
新闻展示
-
index.html中修改类名为eleven wide column的div容器
<!--右边新闻列表--> <div class="eleven wide column"> <!--header--> <div class="ui top attached segment"> <div class="ui middle aligned two column grid"> <div class="column"> <h3 class="ui teal header">新闻</h3> </div> <div class="right aligned column"> 共 <h2 class="ui orange header m-inline-block m-text-thin" th:text="${page.totalElements}" > 14 </h2> 篇 </div> </div> </div> <!--content--> <div class="ui attached segment"> <div class="ui padded vertical segment m-padded-tb-large" th:each="news : ${page.content}"> <div class="ui middle aligned mobile reversed stackable grid" > <div class="eleven wide column"> <h3 class="ui header" ><a href="#" target="_blank" class="m-black" th:text="${news.title}" >标题</a></h3> <p class="m-text" th:text="|${news.description}...|" >段落...</p> <div class="ui grid"> <div class="eleven wide column"> <div class="ui mini horizontal link list"> <div class="item"> <img src="../static/images/wechat.jpg" alt="" class="ui avatar image" th:src="@{${news.user.avatar}}" > <div class="content"><a href="#" class="header" th:text="${news.user.nickname}" >hualili</a></div> </div> <div class="item"> <i class="calendar icon"></i><span th:text="${#dates.format(news.updateTime, 'yyyy-MM-dd')}" >2017-10-01</span> </div> <div class="item"> <i class="eye icon"></i> <span th:text="${news.views}" >2342</span> </div> </div> </div> <div class="right aligned five wide column"> <a href="#" target="_blank" class="ui teal basic label m-padded-tiny m-text-thin" th:text="${news.type.name}" >认知升级</a> </div> </div> </div> <div class="five wide column"> <a href="#" target="_blank"> <img src="../static/images/wechat.jpg" alt="" class="ui rounded image" th:src="@{${news.firstPicture}}"> </a> </div> </div> </div> </div> <!--footer--> <div class="ui bottom attached segment" th:if="${page.totalPages} > 1"> <div class="ui middle aligned two column grid"> <div class="column"> <a href="#" th:href="@{/(page=${page.number} - 1)}" th:unless="${page.first}" class="ui mini teal basic button">上一页</a> </div> <div class="right aligned column"> <a href="#" th:href="@{/(page=${page.number} + 1)}" th:unless="${page.last}" class="ui mini teal basic button">下一页</a> </div> </div> </div> </div>
-
在web目录下Controll控制器中修改路径“/"处理方法
@GetMapping(