【SpringBoot】DEMO：实战④——在个人中心展示自己发的帖子_springboot个人帖子

作者：我家小花儿 | 2024-05-15 13:14:10

踩

springboot个人帖子

【SpringBoot】DEMO：实战④——在个人中心展示自己发的帖子

一、实现效果
二、实现功能

一、实现效果

效果就职这样

在效果图中，重点是点击进入“个人中心”之后，有两个分页，点击不同分页，显示不同内容

二、实现功能

1. 创建个人中心，UserCenter.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>个人中心</title>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/css/community.css">
    <script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script>
    <script src="/js/bootstrap.min.js" type="application/javascript"></script>

</head>
<body>

<!--导航栏-->
<div th:insert="~{navication :: nav}"></div>

<div class="container-fluid main profile">
    <div class="row">
        <div class="col-lg-9 col-md-12 col-sm-12 col-xs-12">
            <h2><span th:text="${sectionName}"></span></h2>
            <hr>

            <ul  th:each="yourtie:${yourTie}" class="media-list">
                <li class="media">
                    <div class="media-left">
                        <a href="#">
                            <img class="media-object" src="picture/title.jpg" alt="...">
                        </a>
                    </div>
                    <div class="media-body">
                        <h4 th:text="${yourtie.getTitle()}" class="media-heading">Media heading</h4>
                        <span th:text="${yourtie.getContent()}"></span><br>
                        <span class="test-desc">
                        发布人:<span th:text="${yourtie.getUsername()}"></span>
                         | 发布时间：<span th:text="${yourtie.getDate()}"></span>
                        </span>
                    </div>
                </li>
            </ul>



        </div>
        <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
        </div>
        <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12" style="margin-top: 15px">
            <div class="list-group section">
                <a href="/userCenter/tie" th:class="${section == 'tie'}? 'active list-group-item':'list-group-item'">我的发帖</a>
                <a href="/userCenter/message" th:class="${section == 'message'}? 'active list-group-item':'list-group-item'">
                    最新回复
                    <span class="badge">14</span>
                </a>
            </div>
        </div>
    </div>
</div>
</body>
</html>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

子页面相互切换，重点这里

<a href="/userCenter/tie" th:class="${section == 'tie'}? 'active list-group-item':'list-group-item'">我的发帖</a>
<a href="/userCenter/message" th:class="${section == 'message'}? 'active list-group-item':'list-group-item'">最新回复</a>
1
2

使用条件运算符，如果命中，就显示active list-group-item样式，也就是最右边的按钮编程蓝色

2. 个人中心控制器：UserCenterController

新的注解参数：@GetMapping("/userCenter/{action}") 用于实现单个页面的分页功能
@PathVariable是spring3.0的一个新功能：接收请求路径中占位符的值
个人中心控制器设计思路：
- 通过session判断用户是否登录，未登录返回主页
- 进入“我的帖子”页面，返回参数“tie”，用“action”承接，用于判断当前子页面
- 进入“最新回复”，返回参数“message”，同上
- 进入“我的帖子”页面，从cookie中取出value，作为条件查询数据库的User表，找到对应的用户名，把用户名作为条件，查询数据库的Tie表，返回唯一用户名的数据，也就是当前登录用户发的帖子

package com.example.homework.Controller;

@Controller
public class UserCenterController {

    @Autowired
    private TieMapper tieMapper;

    @GetMapping("/userCenter")
    public String to_UserCenter(){
        return "/userCenter/tie";
    }


    @GetMapping("/userCenter/{action}")
    public String profile(
            @PathVariable("action") String action,
            Model model,
            HttpServletRequest request
    ){
        User user = (User) request.getSession().getAttribute("user");
        if(user == null){
            return "redirect:/";
        }
        User username = null;
        if("tie".equals(action)){
            Cookie[] cookies = request.getCookies();
            for (Cookie cookie : cookies) {
                if (cookie.getName().equals("token")){
                    String token = cookie.getValue();
                    username = tieMapper.findByToken(token);
                    break;
                }
            }
            List<Tie> yourTie = tieMapper.showOneTie(username.getUsername());
            model.addAttribute("section","tie");
            model.addAttribute("sectionName","我的发帖");
            model.addAttribute("yourTie",yourTie);

        }else if("message".equals(action)){
            model.addAttribute("section","message");
            model.addAttribute("sectionName","最新回复");
        }
        return "userCenter";
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

完工！

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/573020