update:2020-02-28:按道理来说这个功能在前后端分离的时候应该不怎么用的上,基本到现在我还是没遇到过有这样的需求,不过也是一种方法就是。th:href="@{/{role}/login/{userName}(userName=${session.user},role=${session.role})}"
基本流程
1.问题场景:简单描述整个问题实现的流程
2.相关配置:就是整个问题中涉及到的最关键的属性,或者某些配置方式
3.解决过程:围绕这个问题,从开头到结尾解析这个问题是怎么解决的【介绍怎么实现连接里动态传递多个值以及怎么实现隐藏与显示的效果,th:if,th:href,th:text】
4.写的不好,见谅
1.问题场景:
在用SpringBoot做登陆成功显示个人资料页面,然后回到主页之后把主页登陆注册按钮隐藏,然后显示用户名,点击用户名可以回到个人资料页面
下面是主页的登陆注册(这个时候还没有登陆)
然后就去登陆了,演示的是登陆成功的例子
点击主页图标之后,回到主页:会发现登陆注册按钮没了,取而代之的是一个用户名(按钮的样式),后面也可以把用户名改成头像什么的
然后点击用户名按钮就又可以回到个人资料页面了
2.相关配置:
2.1设置的Session的属性值:
2.2登陆成功按钮引导的链接就是上面的/mid/login/whoseName,比如这个:localhost/mid/login/李明,就会以李明这个用户的身份登陆进系统
3.解决过程:
3.1因为后台session属性值都设置好了,这里的问题就是
使用Thymeleaf的th:href标签控制链接的跳转方向,
通过th:if控制标签是显示还是隐藏,
通过th:text控制标签显示的文本
3.2
<!--登录/注册按钮--> <form class="offset-3" th:action="@{/}" method="post"> <input th:if="${session.user} == null" class="btn btn-outline-primary login " type="submit" value="登陆/注册"> </form> <div th:if="${session.user} != null" >
<!--下面th:href里有两个可变参数--> <a th:href="@{/{role}/login/{userName}(userName=${session.user},role=${session.role})}" id="userInfoLink" class="btn btn-outline-primary login text-white" th:text="${session.user}"></a> </div> <!--登录/注册按钮-->
th:if="${session.user == null}"表示查询session里的user属性值,如果用户是刚进来的话,那么就显示【登陆/注册】按钮,然后用户登录成功之后这个表达式里的布尔值就成为false了
div盒子里的th:if="${session.user == null}" 同上
a标签里的th:href="@{/{role}/login/{userName}(userName=${session.user},role=${session.role})}"
这个的意思就是:我想把a标签的href的属性设置成符合【/mid/login/whoseName】这个链接的格式,
所以/{role}对应的是mid,因为登陆用户可能是【中学生mid】,也可能是【大学生high】,
然后role是不确定的,所以在后面用role = $(session.role}),从session获取用户身份,
然后把它作为参数,放进链接地址里,这是这个链接里的第一个可变参数--End
/{role}/login的login是固定的--End
/{role/login/{userName}是第二个可变参数,通过获取session.user查询用户名,然后把用户名设置进链接地址里--End
3.3 ( userName=${session.user},role=${session.role} )这个是跟在/{role}/login/{userName}后面,是用来设置前面可变参数的,
意思就是从session里获取user值或者role值,然后设置到链接路径里
这个就是多个可变值进行传递的方法,多个属性值赋值写在圆括号里,用逗号分隔开
3.4这个是自己在床上想了好久,也问了好多次度娘,问题终于解决了,为了防止忘了,就写下来哇