layui框架是什么(Layui简单使用总结)
簡介
layui（諧音：類UI) 是一款采用自身模塊規(guī)范編寫的前端 UI 框架，遵循原生 HTML/CSS/JS 的書寫與組織形式，門檻極低，拿來即用。其外在極簡，卻又不失飽滿的內(nèi)在，體積輕盈，組件豐盈，從核心代碼到 API 的每一處細節(jié)都經(jīng)過精心雕琢，非常適合界面的快速開發(fā)。layui 首個版本發(fā)布于2016年金秋，她區(qū)別于那些基于 MVVM 底層的 UI 框架，卻并非逆道而行，而是信奉返璞歸真之道。準確地說，她更多是為服務端程序員量身定做，你無需涉足各種前端工具的復雜配置，只需面對瀏覽器本身，讓一切你所需要的元素與交互，從這里信手拈來。
layui 兼容人類正在使用的全部瀏覽器（IE6/7除外），可作為 PC 端后臺系統(tǒng)與前臺界面的速成開發(fā)方案。
獲得Layui
1. 官網(wǎng)首頁下載
下載Layui到官網(wǎng)：https://www.layui.com/下載到 layui 的最新版，它經(jīng)過了自動化構(gòu)建，更適合用于生產(chǎn)環(huán)境。目錄結(jié)構(gòu)如下：
2. Git 倉庫下載
你也可以通過GitHub或碼云得到 layui 的完整開發(fā)包，以便于你進行二次開發(fā)，或者 Fork layui 為我們貢獻方案
3. npm 安裝
npm install layui-src
登錄后復制
一般用于 WebPack 管理
相關推薦：《layui框架教程》
用法
1.模塊化的用法（推薦）
我們推薦你遵循 layui 的模塊規(guī)范建立一個入口文件，并通過 layui.use() 方式來加載該入口文件，如下所示：
<script>
layui.config({
base: '/js/modules/' //你存放新模塊的目錄，注意，不是layui的模塊目錄
}).use('index'); //加載layui入口
</script>
上述的 index 即為你/js/modules/ 目錄下的 index.js，它的內(nèi)容如下：
/**
項目JS主入口
以依賴layui的layer和form模塊為例
**/
layui.define(['layer', 'form'], function(exports){
var layer = layui.layer
,form = layui.form;
layer.msg('Hello World');
exports('index', {}); //注意，這里是模塊輸出的核心，模塊名必須和use時的模塊名一致
});
登錄后復制
2.非模塊化用法
如果你并不喜歡 layui 的模塊化組織方式，你完全可以毅然采用“一次性加載”的方式，我們將 layui.js 及所有模塊單獨打包合并成了一個完整的js文件，用的時候直接引入這一個文件即可。當你采用這樣的方式時，你無需再通過 layui.use() 方法加載模塊，直接使用即可，如：
<script src="../layui/layui.all.js"></script>
<script>
//由于模塊都一次性加載，因此不用執(zhí)行 layui.use() 來加載對應模塊，直接使用即可：
!function(){
//無需再執(zhí)行l(wèi)ayui.use()方法加載模塊，直接使用即可
var form = layui.form
,layer = layui.layer;
//…
}();
</script>
登錄后復制
但你必須知道，采用該方式，意味著 layui 的模塊化已經(jīng)失去了它的意義。但不可否認，它使用起來會更簡單直接。
以上就是layui框架是什么的詳細內(nèi)容，更多請關注風君子博客其它相關文章！
總結(jié)
以上是生活随笔為你收集整理的layui框架是什么(Layui简单使用总结)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
