layui+beetl实现三级菜单

Posted 2021-01-26 kongkongfabian

<ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
            <!--一级菜单栏-->
            @for(title in titles){
                <!-- 判断是否包含二级菜单栏 -->
                @if(tool.isEmpty(title.children)){
                    <li data-name="get" class="layui-nav-item">
                        <a href="javascript:;" lay-href="${ctxPath}${title.url}" lay-tips="${title.name}" lay-direction="2">
                            <i class="layui-icon ${title.icon}"></i>
                            <cite>${title.name}</cite>
                        </a>
                    </li>
                @}else{
                    <li data-name="home" class="layui-nav-item">
                        <a href="javascript:;" lay-tips="${title.name}" lay-direction="2">
                            <i class="layui-icon ${title.icon}"></i>
                            <cite>${title.name}</cite>
                        </a>
                        <!--循环二级菜单-->
                        @for(subTitle in title.children){
                            <dl class="layui-nav-child">
                                <!-- 判断是否包含三级菜单 -->
                                @if(tool.isEmpty(subTitle.children)){
                                    <dd data-name="console">
                                        <a lay-href="${ctxPath}${subTitle.url}">${subTitle.name}</a>
                                    </dd>
                                @}else{
                                    <dd data-name="console">
                                        <a href="javascript:;">${subTitle.name}<span class="layui-nav-more"></span></a>
                                        @for(subTitleC in subTitle.children){
                                            <dl class="layui-nav-child">
                                                <dd data-name="list">
                                                    <a lay-href="${ctxPath}${subTitleC.url}">${subTitleC.name}</a>
                                                </dd>
                                            </dl>
                                        @}
                                    </dd>
                                @}
                            </dl>
                        @}
                    </li>
                @}
            @}
        </ul>

没时间整理，有时间深度挖掘实现无限菜单