ホームページ > 記事 > ウェブフロントエンド > layui はモジュールを定義し、インスタンスを使用します
layuiを使用する過程で、複数のjsから参照する必要があるメソッドがいくつかあるため、ドキュメントに従ってlayuiモジュールをカスタマイズしました。実装プロセスは次のとおりです。 (推奨: layui 使用法チュートリアル )
最初にモジュールを定義します
//定义模块 layui.define(['form'], function(exports){ var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功 var $ = layui.$; var obj = { changeParentPlace: function (parentId,tagId,levelPlace) { $.ajax({ url:ctx + '/base/place/changeParentPlace', type:'get', data:{ parentId:parentId }, dataType:'json', success:function (data) { $("#" + tagId).empty(); $("#" + tagId).append('<option value="">请选择</option>'); if(data.result != null && data.result.length != 0) { $.each(data.result,function(i,place) { if(levelPlace == place.name) { $("#" + tagId).append('<option selected value="'+place.id+'">'+place.name+'</option>') }else { $("#" + tagId).append('<option value="'+place.id+'">'+place.name+'</option>') } }) } form.render('select'); //刷新select选择框渲染 } }) } } //输出模块 exports('common', obj); });
layui.define を使用してメソッドを定義します
define の最初のパラメータは読み込むことができますlayui のいくつかの組み込みレイヤー モジュールを使用するには、いくつかのパブリック メソッドが 2 番目のコールバック メソッドで定義されます
exports の最初のパラメーターはこのモジュールの名前で、2 番目のパラメーターはこれらが含まれるオブジェクトです。
モジュールを設定します
//设置模块 layui.config({ base: ctx + '/js/app/modules/' //假设这是你存放拓展模块的根目录 }).extend({ //设定模块别名 common:'common' });
layui.config を使用してモジュールを定義します
base はモジュールを定義する js が配置されるディレクトリを定義します
common は設定のエイリアス、'common' はディレクトリ内のファイル名 (.js が自動的に追加されます)
モジュールの呼び出し
layui.use(['common'], function(){ var common = layui.common; common.changeParentPlace($("#firstLevelId").val(),'secondLevelId'); });
最初に common モジュールを使用し、呼び出しコードは上記と同じです common.changeParentPlace($("#firstLevelId") .val(),'secondLevelId'); は組み込みモジュールを使用する場合と同じです
以上がlayui はモジュールを定義し、インスタンスを使用しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。