之前在layui 1.0的時候?qū)戇^一個三級菜單，那時候用三級菜單還要自己擴展，與后臺交互也顯得麻煩，現(xiàn)在新版本的layui自動就可以實現(xiàn)三級菜單了，很多朋友在問，我就幫大家整理了一下樣式大家可以改改，直接上代碼：

<link rel="stylesheet" type="text/css" href="css/layui.css" /> <script src="layui.all.js"></script><ul class="layui-nav layui-nav-tree" ><li data-name="home" class="layui-nav-item"><a href="javascript:;" lay-tips="主頁" lay-direction="2"><i class="layui-icon layui-icon-home"></i><cite>主頁</cite><span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd data-name="console" class="layui-this"><a lay-href="home/console.html">控制臺</a></dd></dl></li><li data-name="component" class="layui-nav-item layui-nav-itemed"><a href="javascript:;" lay-tips="組件" lay-direction="2"><i class="layui-icon layui-icon-component"></i><cite>組件</cite><span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd data-name="grid"><a href="javascript:;">柵格<span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd data-name="list"><a lay-href="component/grid/list.html">等比例列表排列</a></dd><dd data-name="mobile"><a lay-href="component/grid/mobile.html">按移動端排列</a></dd></dl></dd><dd data-name="button"><a lay-href="component/button/index.html">按鈕</a></dd></dl></li> </ul>

這里提醒一下，要加載layui.all.js，加載layui.js菜單收縮功能無效。
只要按這種寫法，應(yīng)該是可以實現(xiàn)無限級菜單的。與后臺交互的時候用地柜算法就可以全部遍歷出來，這里沒有寫實例，如果遇到問題的可以留言交流，謝謝。

總結(jié)

以上是生活随笔為你收集整理的layui左侧三级菜单2.0的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。