Layui基本介紹
2016年10月，名不見經(jīng)傳的layui憑借layer多年來積累下來的人氣獲得了一定關(guān)注，從1.0.0的首個(gè)版本發(fā)布至今，已經(jīng)滿月，layui已進(jìn)行了三次中小規(guī)模的迭代。它并沒有迎合當(dāng)下那些炙手可熱的前端主流，有意或無意地避開了React/Vue等風(fēng)向，專注于原生態(tài)的開發(fā)模式，試圖成為國(guó)內(nèi)更容易入門和使用的前端UI解決方案。正是因?yàn)檫@樣的追求，我們無懼險(xiǎn)阻、無畏任何挑戰(zhàn)。layui下一個(gè)大版本已經(jīng)進(jìn)入了開發(fā)日程，它將彌補(bǔ)當(dāng)前版本存在的諸多缺陷，有可能直接跳躍到2.0，你盡管放心地期待，它基本無縫兼容1.x。
Layui軟件特色
- 返璞歸真
身處在前端社區(qū)的繁榮之下，我們都在有意或無意地追逐。而Layui偏偏回望當(dāng)初，奔赴在返璞歸真的漫漫征途，自信并勇敢著，追尋于原生態(tài)的書寫指令，試圖以最簡(jiǎn)單的方式詮釋高效。
- 雙面體驗(yàn)
擁有雙面的不僅是人生，還有Layui。一面極簡(jiǎn)，一面豐盈。極簡(jiǎn)是視覺所見的外在，是開發(fā)所念的簡(jiǎn)易。豐盈是傾情雕琢的內(nèi)在，是信手拈來的承諾。一切本應(yīng)如此，簡(jiǎn)而全，雙重體驗(yàn)。
- 星辰大海
如果眼下還是一團(tuán)零星之火，那運(yùn)籌帷幄之后，迎面東風(fēng)，就是一場(chǎng)烈焰燎原吧，那必定會(huì)是一番盡情的燃燒。待，秋風(fēng)蕭瑟時(shí)，散作滿天星辰，你看那四季輪回，正是Layui不滅的執(zhí)念。
Layui快速上手指南
獲得layui后，將其完整地部署到你的項(xiàng)目目錄(或靜態(tài)資源服務(wù)器)，你只需要引入下述兩個(gè)文件：
沒錯(cuò)，不用去管其它任何文件。因?yàn)樗麄?比如各模塊)都是在最終使用的時(shí)候才會(huì)自動(dòng)加載。這是一個(gè)基本的入門頁面：
1、規(guī)范化的用法(推薦)
如果你想快速使用Layui的組件，你還是跟平時(shí)一樣script標(biāo)簽引入你的js文件，然后在你的js文件中使用layui的組件。但我們更推薦你遵循Layui的模塊規(guī)范，建立一個(gè)自己的模塊作為入口：
上述的 index 即為你 /res/js/modules/ 目錄下的 index.js，它的內(nèi)容應(yīng)該如下：
2、簡(jiǎn)單粗暴用法
如果你覺得Layui的模塊化還是有點(diǎn)啰嗦，木有關(guān)系的親。Layui考慮到了像你一樣的猿群，我們將layui.js及所有模塊單獨(dú)打包合并成了一個(gè)完整的js文件，用的時(shí)候直接引入這一個(gè)文件即可。當(dāng)你采用這樣的方式，你將不用通過layui.use加載模塊，你只需要直接用，譬如：
但你必須知道，這種使用方式，意味著Layui的模塊化已經(jīng)失去了它的意義。但不可否認(rèn)，它比什么都來的簡(jiǎn)單。
好了，不管你采用什么樣的方式，從現(xiàn)在開始，盡情地使用Layui吧!但愿這是一段美妙的旅程。
Layui常見問題
問：如何使用內(nèi)部jQuery?
答：由于Layui部分內(nèi)置模塊依賴jQuery，所以我們將jQuery1.11最穩(wěn)定的一個(gè)版本作為一個(gè)內(nèi)置的DOM模塊(唯一的一個(gè)第三方模塊)。只有你所使用的模塊有依賴到它，它才會(huì)加載，并且如果你的頁面已經(jīng)script引入了jquery，它并不會(huì)重復(fù)加載。內(nèi)置的jquery模塊去除了全局的$和jQuery，是一個(gè)符合layui規(guī)范的標(biāo)準(zhǔn)模塊。
問：為什么表單不顯示?
答：當(dāng)你使用表單時(shí)，Layui會(huì)對(duì)select、checkbox、radio等原始元素隱藏，從而進(jìn)行美化修飾處理。但這需要依賴于form組件，所以你必須加載 form，并且執(zhí)行一個(gè)實(shí)例。值得注意的是：導(dǎo)航的Hover效果、Tab選項(xiàng)卡等同理(它們需依賴 element 模塊)
問：該如何加載模塊最科學(xué)?
答：事實(shí)上我們?cè)谀K規(guī)范已經(jīng)有明確地說明，你可以采用預(yù)先加載和按需加載兩種模式，但后者我們并不推薦(文檔也解釋原因了)。因此我們強(qiáng)烈推薦的方式是：你應(yīng)該在你js文件的代碼最外層，就把需要用到的模塊 layui.use以 一下。
Layui更新日志
[優(yōu)化] layui.use() 方法，以支持加載非內(nèi)置模塊的合并請(qǐng)求(如您在線上環(huán)境采用「非模塊化加載」的方式，那么最多可以只加載兩個(gè)文件，即：layui.all.js、main.js(你的擴(kuò)展模塊的合并文件)。這將大幅度減少文件請(qǐng)求) #詳見文檔
[新增] layui.url() 底層方法，用于將 url 中的 pathname、search、hash 屬性進(jìn)行對(duì)象化獲取 #詳見文檔
[優(yōu)化] 柵格的列間隔類 .layui-col-space，支持 1-30 區(qū)間所有雙數(shù)間隔，并支持 1、5、15、25 單數(shù)間隔
[優(yōu)化] table 組件的合計(jì)行，若接口直接返回了合計(jì)行數(shù)據(jù)，則優(yōu)先讀取，否則由前端自動(dòng)合計(jì)當(dāng)前行數(shù)據(jù) #詳見文檔
[修復(fù)] upload 組件因上個(gè)版本的 progress(進(jìn)度條) 功能導(dǎo)致的部分情況無法跨域上傳的問題
[優(yōu)化] upload 組件 progress 回調(diào)，在第二個(gè)參數(shù)中返回了當(dāng)前觸發(fā)的元素對(duì)象
[修復(fù)] form 模塊的 select 組件在 lay-disabled 和 lay-search 共用時(shí)出現(xiàn)可編輯問題
[修復(fù)] flow.load() 多次執(zhí)行時(shí)的重復(fù)加載的問題
[修復(fù)] util 組件的 event 方法重復(fù)綁定事件的問題
[新增] 28 個(gè)字體圖標(biāo)
華軍小編推薦：
Layui一直以來是大多數(shù)小伙伴常用軟件，在網(wǎng)民心目中的可是有這霸主地位可見一般，華軍軟件園小編同學(xué)推薦廣大用戶下載Layui使用，快來下載吧，另外還有FastAdmin完整包、404頁面模板、ShopCMS、音樂在線解析源碼(簡(jiǎn)單搭建音樂解析網(wǎng))、搭建解析網(wǎng)易付費(fèi)歌曲下載網(wǎng)站提供下載。
您的評(píng)論需要經(jīng)過審核才能顯示
有用
有用
有用