ホームページ >ウェブフロントエンド >ライユイのチュートリアル >Layui を始める
layui(同音異義語:UI風)は、独自のモジュール仕様で書かれたフロントエンドUIフレームワークで、ネイティブHTML/CSS/JSの書き方や構成形式に準拠しています。箱の。インターフェイスの迅速な開発に非常に適しています。
layui を入手したら、それをプロジェクト ディレクトリ (または静的リソース サーバー) に完全にデプロイします。導入する必要があるのは、次の 2 つのファイルだけです:
./layui/css/layui.css ./layui/layui.js //提示:如果是采用非模块化方式(最下面有讲解),此处可换成:./layui/layui.all.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="../layui/css/layui.css"> </head> <body> <!-- 你的HTML代码 --> <script src="../layui/layui.js"></script> <script> //一般直接写在一个js文件中 layui.use(['layer', 'form'], function(){ var layer = layui.layer ,form = layui.form; layer.msg('Hello World'); }); </script> </body> </html>
注:layui を使用するには、最初にモジュールをロードする必要があります。上記のコードはモジュールをプリロードするものです。最初にモジュールをロードせずにレイヤーを直接使用すると、実行時にエラーが報告されます。レイヤーオブジェクトが見つからない、メソッドが見つからないなどの問題があります。
layui.use(['layer', 'form'], function(){ var layer = layui.layer ,form = layui.form; });
以下は私が使用するコード例です:
layui の呼び出し:
<!--layui--> <link href="/libs/layui/css/layui.css" rel="stylesheet" type="text/css"/> <script src="/libs/layui/layui.js" type="text/javascript"></script>
プリロード:
//layui layer let layuiLayer; //layui预先加载 layui.use(['layer'], function () { layuiLayer = layui.layer; });
layui オブジェクトの使用:
layuiLayer.open({ title: '提示', content: '请输入名字!' })
以上がLayui を始めるの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。