首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
您现在的位置: 程式碼之家 >> 編程語言 >  >> 更多程式語言 >> 程式設計疑難解答

JSP 權限菜單雙層迭代顯示:父子菜單關聯渲染

     編輯:程式設計疑難解答

數據結構

單表 `menu`:id, name, pid(`pid=0` 為一級,`pid=父id` 為二級)。查出 `List

allMenus` 传給 JSP。

JSP 雙層迭代 (Struts2 標簽示例)

<s:iterator value="allMenus" var="parent">
  <s:if test="%{#parent.pid == 0}">
    <div class="menu-group">
      <h3><s:property value="#parent.name"/></h3>
      <ul>
        <s:iterator value="allMenus" var="child">
          <s:if test="%{#child.pid == #parent.id}">
            <li><a href="<s:property value='#child.url'/>"><s:property value="#child.name"/></a></li>
          </s:if>
        </s:iterator>
      </ul>
    </div>
  </s:if>
</s:iterator>

優化:Controller 預構建樹

// Service
List roots = menuDao.findByPid(0);
for (Menu root : roots) {
    root.setChildren(menuDao.findByPid(root.getId()));
}
return roots; // JSP 只需單層迭代 roots -> children

JSTL 純標簽版

<c:forEach items="${menus}" var="parent">
  <c:if test="${parent.pid == 0}">
    <h3>${parent.name}</h3>
    <ul>
      <c:forEach items="${menus}" var="child">
        <c:if test="${child.pid == parent.id}">
          <li><a href="${child.url}">${child.name}</a></li>
        </c:if>
      </c:forEach>
    </ul>
  </c:if>
</c:forEach>

總結

雙層迭代 `O(n²)` 簡單可行(菜單通常 < 100 條),大數據量建議后端構建樹結構降為 `O(n)` 渲染。

  1. 上一篇文章:
  2. 下一篇文章:
Copyright © 程式碼之家 All Rights Reserved