ホームページ  >  記事  >  ウェブフロントエンド  >  layui はモジュールを定義し、インスタンスを使用します

layui はモジュールを定義し、インスタンスを使用します

尚
転載
2019-11-29 14:14:452774ブラウズ

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(&#39;<option value="">请选择</option>&#39;);
                    if(data.result != null && data.result.length != 0) {
                        $.each(data.result,function(i,place) {
                            if(levelPlace == place.name) {
                                $("#" + tagId).append(&#39;<option selected value="&#39;+place.id+&#39;">&#39;+place.name+&#39;</option>&#39;)
                            }else {
                                $("#" + tagId).append(&#39;<option value="&#39;+place.id+&#39;">&#39;+place.name+&#39;</option>&#39;)
                            }
                        })
                    }
                    form.render(&#39;select&#39;); //刷新select选择框渲染
                }
            })
        }
    }

    //输出模块
    exports(&#39;common&#39;, obj);
});

layui.define を使用してメソッドを定義します

define の最初のパラメータは読み込むことができますlayui のいくつかの組み込みレイヤー モジュールを使用するには、いくつかのパブリック メソッドが 2 番目のコールバック メソッドで定義されます

exports の最初のパラメーターはこのモジュールの名前で、2 番目のパラメーターはこれらが含まれるオブジェクトです。

モジュールを設定します

//设置模块
layui.config({
    base: ctx + &#39;/js/app/modules/&#39; //假设这是你存放拓展模块的根目录
}).extend({ //设定模块别名
    common:&#39;common&#39;
});

layui.config を使用してモジュールを定義します

base はモジュールを定義する js が配置されるディレクトリを定義します

common は設定のエイリアス、'common' はディレクトリ内のファイル名 (.js が自動的に追加されます)

モジュールの呼び出し

layui.use([&#39;common&#39;], function(){
    var common = layui.common;

    common.changeParentPlace($("#firstLevelId").val(),&#39;secondLevelId&#39;);

});

最初に common モジュールを使用し、呼び出しコードは上記と同じです common.changeParentPlace($("#firstLevelId") .val(),'secondLevelId'); は組み込みモジュールを使用する場合と同じです

以上がlayui はモジュールを定義し、インスタンスを使用しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。