本文已参与「新人创作礼」活动，一起开启掘金创作之路。
前面提到了最近在用 vue 写页面，然后联想到自己的毕设，昨天回去之后又看了看自己当时的写法，逐渐回想起来，在这里顺便做一下总结。
Layui
前端当时采用的是 Layui 框架，它是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用。
想要快速使用，首先要下载解压出 layui 文件，将其放到自己项目中的静态资源目录下，然后再 HTML 代码中写如下代码进行资源引入：
./layui/css/layui.css
./layui/layui.js <!-- 如果是采用非模块化方式可换成：./layui/layui.all.js -->
<!-- 同时引入 jQuery.js 文件 -->
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
使用
大致的使用方法就是
先画页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>
非模块化方式使用layui
</title>
<link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
<!-- 你的HTML代码 -->
<script src="../layui/layui.all.js"></script><script>
//由于模块都一次性加载，因此不用执行 layui.use() 来加载对应模块，直接使用即可：
;!function(){
var layer = layui.layer
,form = layui.form;
layer.msg('Hello World');
}();
</script>
</body>
</html>
如果有自定义插件，使用如下方式引入
layui.config({
base: '../../static/common/yutons-mods/' //根据实际路径设置自定义插件路径
}).use(['yutons_sug'], function() {});
layui.config({
base: './module/'
}).extend({
iconPicker: 'iconPicker/iconPicker' //实际路径 ./module/iconPicker/iconPicker.js
});
对前面写好的页面进行渲染
form.render(); //更新全部
//或者
form.render('select'); //刷新select选择框渲染
form.render('select', 'test2'); //更新 lay-filter="test2" 所在容器内的全部 select 状态
//注意一下 layui版本
layui.form().render(); //这是1.0的写法
layui.form.render(); //这是2.0更新后的写法
当时在做的时候，也是走一步看一步，边学边做的，自己有很多不会的。最开始就直接套用了官网的一个管理页面的模板，直接在模板的基础上进行了改动。现在去看，官网好像进不去了，这里附上另一个 Layui 说明文档的地址，方便以后自己查看：Layui开发文档
