當前位置：首頁 >

layui简单入门

發布時間：2024/3/12 36 豆豆

生活随笔收集整理的這篇文章主要介紹了 layui简单入门小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

layui:

layui（諧音：類UI) 是一款采用自身模塊規范編寫的前端 UI 框架，遵循原生 HTML/CSS/JS 的書寫與組織形式，門檻極低，拿來即用。非常適合界面的快速開發。layui 首個版本發布于2016年金秋.

官網下載文檔查閱：http://www.layui.com

第三方支持：

Layui部分模塊依賴jQuery（比如layer），但是你并不用去額外加載jQuery。Layui已經將jQuery最穩定的一個版本改為Layui的內部模塊，當你去使用 layer 之類的模塊時，它會首先判斷你的頁面是否已經引入了jQuery，如果沒有，則加載內部的jQuery模塊，如果有，則不會加載。

另外，我們的圖標取材于阿里巴巴矢量圖標庫（iconfont），構建工具采用?Gulp?。除此之外，不依賴于任何第三方工具。

引用文件：

將解壓包文件部署到項目中，引入兩個文件

快速上手：

<body></body><script>//一般直接寫在一個js文件中layui.use(['layer', 'form'], function(){var layer = layui.layer,form = layui.form;layer.msg('Hello World');});</script>

模塊化的用法（推薦使用）：

如果想快速使用Layui的組件，跟平時一樣script標簽引入你的js文件，然后在你的js文件中使用layui的組件。但更推薦你遵循Layui的模塊規范，建立一個自己的模塊作為入口

上述的 index 即為你 /res/js/modules/ 目錄下的 index.js，它的內容應該如下：

/**項目JS主入口以依賴layui的layer和form模塊為例 **/ layui.define(['layer', 'form'], function(exports){var layer = layui.layer,form = layui.form;layer.msg('Hello World');exports('index', {}); //注意，這里是模塊輸出的核心，模塊名必須和use時的模塊名一致 });

總結

以上是生活随笔為你收集整理的layui简单入门的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：服务器2012还原系统,Windows
下一篇： 3 为什么考研？该做那些准备 --绝密,