问题描述
我正在使用Thymeleaf(很好用):
<li class="drop-down" th:classappend="${#httpServletRequest.getRequestURI() == '/url1' ? 'active':''}"><a href="#">MainMenu</a>
<ul>
<li><a href="/url1" th:href="@{/url1}"><i
class="fas fa-users"></i> url1</a></li>
<li><a href="/url2" th:href="@{/url2}"><i
class="fas fa-users"></i> url2</a></li>
<li><a href="/url3" th:href="@{/url3}"><i
class="far fa-file-alt mr-1"></i> url3</a></li>
<li><a href="/url4" th:href="@{/url4}"><i
class="fas fa-sign-out-alt mr-1"></i>url4</a></li>
</ul></li>
现在,如果单击URL 1/2/3/4中的任意一个,我想将活动类设置为主菜单。所以我尝试了一下(但没有用):
<li class="drop-down" th:classappend="${#httpServletRequest.getRequestURI() == '/url1' ? 'active':'' :: '/url2' ? 'active':'' :: '/url3' ? 'active':'' :: '/url4' ? 'active':'' }"
我也尝试了很多其他与“ or”和“ ||”的组合,但没有任何效果。所有这些URL(上下文路径)完全不同,我不能使用-包含。我确定我没有这个想法,但是在这里需要一些帮助。请提出。
解决方法
似乎当请求URI与一组固定值中的任何一个匹配时,您都想附加active
类。因此,您可以这样编写<li>
元素:
<li
class="drop-down"
th:with="urls=${new String[]{'/url1','/url2','/url3','/url4'}}"
th:classappend="${#arrays.contains(urls,#httpServletRequest.getRequestURI()) ? 'active' : ''}">
...其中:
-
th:with
声明了一个名为urls
的数组,其中包含触发添加类的URL。 -
th:classappend
检查urls
数组是否包含#httpServletRequest.getRequestURI()
返回的值并有条件地附加一个类。