LayUI后端布局实现导航栏点击主体内容改变

<div class="layui-body">
    <!-- 内容主体区域,改为<iframe>标签即可 -->
    <iframe src="" name="middle" width="100%" height="100%" frameborder="0"></iframe>
</div>

 <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree"  lay-filter="test">
    <li class="layui-nav-item layui-nav-itemed"><a href="javascript:;">主页</a></li>
    <li class="layui-nav-item">
        <a class="" href="javascript:;">系统管理</a>
        <dl class="layui-nav-child">
            <!--href中正常写链接，用target属性指向iframe的name即可-->
            
            <dd><a href="user/index.do" target="middle">用户管理</a></dd>
            
            <dd><a href="javascript:;">角色管理</a></dd>
            <dd><a href="javascript:;">权限管理</a></dd>
        </dl>
    </li>