溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下layui怎么用，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
獲得 Layui
你可以在官網(wǎng)首頁下載到 Layui 的最新版，也可以通過 GitHub 得到Layui的開源包。目前只同步維護(hù)這兩處資源渠道。一般如果你是用于實際項目，推薦你直接從官網(wǎng)下載。layui構(gòu)建后的結(jié)構(gòu)（也就是你獲得的包）
├─css //css目錄 │ └─modules //模塊css目錄（一般如果模塊相對較大，我們會單獨提?。?nbsp; │ ├─laydate │ ├─layer │ │ └─default │ └─layim │ └─skin ├─font //字體圖標(biāo)目錄 ├─images //圖片資源目錄（一些表情等） │ └─face └─lay //JS目錄 │ ├─dest //經(jīng)過合并的完整模塊 │ └─modules //各模塊/組件 └─layui.js
快速上手
獲得layui后，將其完整地部署到你的項目目錄（或靜態(tài)資源服務(wù)器），你只需要引入下述兩個文件：
./layui/css/layui.css./layui/layui.js
沒錯，不用去管其它任何文件。因為他們（比如各模塊）都是在最終使用的時候才會自動加載。這是一個基本的入門頁面：
<!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="build/css/layui.css"> </head> <!-- 你的HTML代碼 --> <script src="build/layui.js"></script> <script> //一般直接寫在一個js文件中 layui.use(['layer', 'form'], function(){ var layer = layui.layer ,form = layui.form(); layer.msg('Hello World'); }); </script> </body></html>規(guī)范化的用法（推薦）
如果你想快速使用Layui的組件，你還是跟平時一樣script標(biāo)簽引入你的js文件，然后在你的js文件中使用layui的組件。但我們更推薦你遵循Layui的模塊規(guī)范，建立一個自己的模塊作為入口：
<script>layui.config({ base: '/res/js/modules/' //你的模塊目錄}).use('index'); //加載入口</script>上述的 index 即為你 /res/js/modules/ 目錄下的 index.js，它的內(nèi)容應(yīng)該如下：
<script>/** 項目JS主入口 以依賴Layui的layer和form模塊為例**/ layui.define(['layer', 'form'], function(exports){ var layer = layui.layer ,form = layui.form(); layer.msg('Hello World'); exports('index', {}); //注意，這里是模塊輸出的核心，模塊名必須和use時的模塊名一致}); </script>簡單粗暴用法
如果你覺得Layui的模塊化還是有點啰嗦，木有關(guān)系的親。Layui考慮到了像你一樣的猿群，我們將layui.js及所有模塊單獨打包合并成了一個完整的js文件，用的時候直接引入這一個文件即可。當(dāng)你采用這樣的方式，你無需再通過layui.use加載模塊，直接使用即可，如：
<script src="../layui/lay/dest/layui.all.js"></script> <script>;!function(){ //當(dāng)使用了 layui.all.js，無需再執(zhí)行l(wèi)ayui.use()方法 var from = layui.form() ,layer = layui.layer; //…}();</script>但你必須知道，這種使用方式，意味著Layui的模塊化已經(jīng)失去了它的意義。但不可否認(rèn)，它比什么都來的簡單。
以上是“l(fā)ayui怎么用”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！
免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號
手機(jī)網(wǎng)站二維碼