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中內置的模塊來使用，第二個回調方法中定義一些公共的方法

exports的第一參數是這個模塊起的名字，第二個參數是一個對象該對象中定義了這三個方法

設置模塊

//設置模塊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模塊use出來，調用代碼如上common.changeParentPlace($("#firstLevelId").val(),'secondLevelId');和使用內置模塊是一樣的

感謝各位的閱讀！關于“layui如何定義一個模塊并使用”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！