layui的tree如何实现动态加载_layui navTree 动态渲染菜单组件介绍

navTree.js 简介

extends/navTree.js 是一个基于 layui 扩展的模块化组件，使用它您可以很方便地构建后台布局系统中的垂直导航菜单与水平导航菜单。

extends/navTree.js 原本是作者在开源面板项目 Layui Fun CMS 中编写的一个基于 layui 的动态渲染菜单的组件，现在把这个扩展组件独立开发出来，使它不必依赖与 Layui Fun CMS 一起使用，只要你的后台系统符合 layui 后台布局的规范，即可独立使用这个组件，这将极大地方便开发者编写自己喜爱的代码。

extends/navTree.js 组件是用来渲染生成符合 layui 语义化的水平导航菜单与垂直导航菜单结构，导航菜单点击后将会在客户端本地存储(window.localStorage)，因此刷新页面后，右侧 iframe 载入时将保持打开上一个页面链接。

看到这，您应该知道，navTree 组件适合 iframe 版的后台布局系统使用。

软件架构

扩展组件：extends/navTree.js

安装教程

1. 本项目是一个前端项目，但是因为在脚本方法中使用了获取 json 数据请求的方式来模拟与服务端交互，为防止浏览器提示跨域问题，因此项目文件需要部署在 web 容器下运行方可正常浏览，如：nginx、IIS、phpStudy、apache tomcat，推荐：nginx；

2. nginx.conf 相关配置：

#host layui_fun_cms

server {

listen 8000;

server_name localhost;