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這個是自己在床上想了好久,也問了好多次度娘,問題終於解決了,為了防止忘了,就寫下來哇