如何获取菜单的当前链接（11ty / ejs）？答案

【问题标题】：How to get the current link for a menu (11ty / ejs)?如何获取菜单的当前链接（11ty / ejs）？
【发布时间】：2021-09-03 04:12:47
【问题描述】：

我有一个 menu.json 文件，其中包含有关页面及其链接的信息：

{
    "Home": "./",
    "Services": "./services.html",
    "About": "./about.html",
    "Portfolio": "./portfolio.html",
    "Team": "./team.html",
    "Contact": "./contact.html"
}

我有部分 header.ejs，将包含在页面中：

<ul
  class="main-menu"
  >
    <% for (var link in menu) { %>
      <li class="main-menu__item">
         <a
           class="main-menu__link"
           href="<%= menu[link] %>"
           ><%= link %>
         </a>
       </li>
   <% } %>
</ul>

我想为当前页面链接添加一个类。我该怎么办？

【问题讨论】：

标签： ejs eleventy

【解决方案1】：

在Eleventy Supplied Data 的文档中，他们提到了包含page.url 的页面对象。如果您将其与链接值进行比较，您可以识别您何时在页面上。

可能是这样的：

<ul
  class="main-menu"
  >
    <% for (var link in menu) { %>
      <li class="main-menu__item">
         <a
           class="main-menu__link
<% if(page.url === link) { %>
currentpage
<% } %>
"
           href="<%= menu[link] %>"
           ><%= link %>
         </a>
       </li>
   <% } %>
</ul>

【讨论】：