<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>数据菜单</title> <link rel="stylesheet" href="../../component/pear/css/pear.css"/> </head> <body class="pear-container"> <div class="layui-row layui-col-space10"> <div class="layui-col-md12"> <div class="layui-card"> <div class="layui-card-header">开发环境</div> <div class="layui-card-body"> Menu 数据菜单对普通菜单的深度封装 </div> </div> </div> <div class="layui-col-md12"> <div class="layui-collapse"> <div class="layui-colla-item"> <h2 class="layui-colla-title">显示代码</h2> <div class="layui-colla-content"> <pre class="layui-code" lay-encode="true"> <link rel="stylesheet" href="component/pear/css/pear.css" /> 并 <script src="component/layui/layui.js"></script> 并 <script src="component/pear/pear.js"></script> </pre> </div> </div> </div> </div> <div class="layui-col-md6"> <div class="layui-card"> <div class="layui-card-header">实例</div> <div class="layui-card-body"> <button id="collapse" class="pear-btn">隐藏</button> <br/> <br/> <div id="sideMenu"></div> </div> </div> </div> <div class="layui-col-md6"> <div class="layui-collapse"> <div class="layui-colla-item"> <h2 class="layui-colla-title">显示代码</h2> <div class="layui-colla-content layui-show"> <pre class="layui-code" lay-encode="true"> var sideMenu = menu.render({ elem: 'sideMenu', async: true, theme: "light-theme", height: '300px', control: false, defaultMenu: 0, accordion: true, url: "../../admin/data/menu.json", parseData: false, done: function() { layer.msg("加载完成") } }); sideMenu.click(function(dom, data) { layer.msg("菜单点击 : " + JSON.stringify(data)); }) </pre> </div> </div> </div> </div> </div> </body> <script src="../../component/layui/layui.js"></script> <script src="../../component/pear/pear.js"></script> <script> layui.use(['layer', 'form', 'element', 'menu', 'code','jquery' ], function() { var layer = layui.layer, menu = layui.menu, $ = layui.jquery, form = layui.form; layui.code(); var sideMenu = menu.render({ elem: 'sideMenu', async: true, theme: "light-theme", height: '300px', control: false, defaultMenu: 0, accordion: true, url: "../../admin/data/dataMenu.json", parseData: false, done: function() { layer.msg("加载完成") } }); sideMenu.click(function(dom, data) { layer.msg("菜单点击 : " + JSON.stringify(data)); }) $("#collapse").click(function(){ sideMenu.collapse(); }) }); </script> </html>