html - 如何防止将 Spring Security 与 Thymeleaf 结合使用破坏 CSS 格式？

Question

我正在使用 Thymeleaf 和 Spring Security。我有一个下拉菜单，其中包含列表项。不幸的是，由于 Thymeleaf + Spring Sec 集成使用了一个 div，如下所示，这意味着我们现在有一个 ul，里面有一个 div，里面有一个 li。这打破了 bootsrap 的 css 格式化，而 less 期望 ul>li。换句话说，li 应该是下拉列表 ul 的直接子项，但在我的例子中不是因为 sec:authorize div。这是那些 css 依赖项:picture.

<ul class="dropdown-menu text-left">
    <li>
        <a role="button" class="a-primary btn-xs" data-bind="click: $parent.view"><span class="fa fa-search"></span> View</a>
    </li>
    <div sec:authorize access="hasAnyRole('A_ROLE', 'ANOTHER_ROLE')">
        <li>
            <a role="button" class="a-primary btn-xs" data-bind="visible: permissions().contains('Edit'), click: $parent.edit"><span class="fa fa-pencil"></span> Edit</a>
        </li>
        (more <li> elements in here)
    </div>
</ul>

因此第一个 li 显示正确，但 sec:authorize div 中的 li 格式不正确。

如何在不编辑我依赖的 .css 文件的情况下使内部 li 元素正确显示？谢谢。

Answer 1

您不需要在 div 中添加您的授权。您可以改用 th:block，它不会创建任何额外的元素。

<th:block sec:authorize="hasAnyRole('A_ROLE', 'ANOTHER_ROLE')">
    <li>
        <a role="button" class="a-primary btn-xs" data-bind="visible: permissions().contains('Edit'), click: $parent.edit"><span class="fa fa-pencil"></span> Edit</a>
    </li>
</th:block>