layuiAdmin pro v1.x 【单页版】开发者文档.pdf

目 录 layuiadmin单页面文档 本文档使用 看云 构建 - 2 - layuiadmin单页面文档 layuiadmin单页面文档 题外 快速上手 部署 目录说明 宿主页面 全局配置 侧边菜单 路由 路由规则 路由跳转 路由结尾 视图 视图与路由的关系 视图中加载 JS 模块 动态模板 定义模板 模板基础属性 登录与接口鉴权 登录拦截器 流程 接口鉴权 基础方法 ID唯一性 实用组件 Hover 提示层 事件监听 兼容性 缓存问题 升级事项 源码构建 题外 本文档使用 看云 构建 - 3 - layuiadmin单页面文档 该文档适用于 layuiAdmin 专业版 （单页面 ），阅读之前请务必确认是否与你使用的版本对应。 熟练掌握 layuiAdmin 的前提是熟练掌握 layui ，因此除了本篇文档 ， layui 的文档 也是必不可少的存在。 快速上手 部署 1. 解压文件后 ，将 layuiAdmin 完整放置在任意目录 2. 通过本地 web 服务器去访问 ./start/index.html 即可运行 Demo 由于 layuiAdmin 可采用前后端分离开发模式 ，因此你无需将其放置在你的服务端 MVC 框架中 ，你只需要给 layuiAdmin 主入口页面 （我们也称之为 ：宿主页面 ）进行访问解析 ，它即可全权完成自身路由的跳转和视图 的呈现 ，而数据层则完全通过服务端提供的异步接口来完成。 目录说明 src/ layuiAdmin 源代码 ，通常用于开发环境 （如本地 ），推荐你在本地开发时 ，将 ./start/index.html 中的 layui.css 和 layui.js 的引入路径由 dist 改为 src 目录。 src/controller/ ：存放 JS 业务模块 ，即对视图进行事件等交互性处理 src/lib/ ：layuiAdmin 的核心模块 ，一般不推荐修改 src/style/ ：存放样式 ，其中 admin.css是核心样式 src/views/ ：存放视图文件。其中 layout.html 是整个框架结构的承载 ，一般不推荐做大量改动。 src/config.js ：layuiAdmin 的全局配置文件 ，可随意修改。 src/index.js ：layuiAdmin 的入口模块 ，一般不推荐修改 dist/ 通过 gulp 将 layuiAdmin src 目录的源代码进行构建后生成的目录 （即 ：将 JS 和 CSS 文件进行了压缩等处 理 ），通常用于线上环境。关于 gulp 的使用 ，下文也有介绍。 start/ 存放 layuiAdmin 的入口页面、模拟接口数据、layui 宿主页面 你所看到的 start/index.html 是我们提供好的宿主页面 ，它是整个单页面的承载 ，所有的界面都是在这一个页面 中完成跳转和渲染的。事实上 ，宿主页面可以放在任何地方 ，但是要注意修改里面的 <link> <script> 的 src 和 layui.config 中 base 的路径。 全局配置 当你已经顺利在本地预览了 layuiAdmin 后 ，你一定迫不及待关注更深层的结构。打开 src 目录 ，你将看到 本文档使用 看云 构建 - 4 - layuiadmin单页面文档 config.js ，里面存储着所有的默认配置。你可以按照实际需求选择性