java - 覆盖 liferay-ui 导航标签库

Question

问题

我正在 Liferay 主题中实现一个 css 组件库，将 css 添加到 custom.css 文件中。我在实现导航更改时遇到了一个问题，该导航当前使用标签库 liferay-ui:navigation 来生成导航并设置导航样式(使用 init.jsp 和page.jsp 在导航标签库中)。 taglib 在自定义导航 Hook 中被调用为:

<liferay-ui:navigation
bulletStyle="<%= bulletStyle %>"
displayStyle="<%= displayStyle %>"
...etc
/>

这会生成以下 html:

<div class="nav-menu nav-menu-style-dots" id="aui_3_4_0_1_406">
  <ul class="layouts level-1" id="aui_3_4_0_1_405">
    ...list items
  </ul>
</div>

标签库 page.jsp 中的相关行是:

<div class="nav-menu nav-menu-style-<%= bulletStyle %>">

和

sb.append("<ul class=\"layouts level-");

组件库不使用 Liferay 生成的类名，并且该库在多个应用程序中使用，并非全部内置在 Liferay 中。

选项

为了解决这个问题，我认为我有两个选择:

• 更改组件库中的 css 类以匹配 Liferay 生成的类。我不喜欢这个选项，因为这意味着不同的应用程序中会有不同的 css 类，每个类都做同样的事情。此外，它还消除了拥有组件库的好处。
• 找到一些覆盖标签库的方法，例如creating a custom hook或修改我现有的导航 Hook 。我更喜欢此选项，因为它使组件库保持完整并且更易于维护。

问题

是否可以使用钩子(Hook)或其他方法(可能是 alloy-ui)覆盖 liferay-ui 导航标签库以覆盖 page.jsp 中的上述行？

Answer 1

是的，可以用 jsp-hook 覆盖 taglib 实现(我刚刚用我的 custom navigation 应用程序的出色更新测试了它，正是你提到的 jsp)。但是，如果你能用 css 解决你的问题，我发现这是更可取的解决方案。 CSS 的侵入性要小得多，即使您现在有两个不同的 CSS 选择器做同样的事情，另一种方法是让一个 JSP 钩子(Hook)和一个 CSS 更改来做出选择。

将 JSP 更改留给实际结构所需的更改(如果可能)，并尽可能使用 CSS。您的主题是自定义 CSS 的自然位置 - 恕我直言，它最好在那里维护。