Layui 加载自己的js文件

Posted 2020-12-14 今年我二十有七

第一步：定义模块

自定义一个js文件，例如：public/static/common/js/demo.js             //你存放新模块的目录，注意，不是layui的模块目录

demo.js内容如下：

layui.define([‘layer‘], function(exports) {
    var layer = layui.layer;

    var api = {
        aaa: function (tblId) {
            layer.msg(‘111‘);
        }


    };
    //expotts("key",value)
    //key你懂吧？  待会在第二步就要用key值来获取var table这个对象。继而调用对象中函数
    exports(‘demo‘, api);
});



第二部：在js中使用模块

<script th:src="@{/layui/layui.js}"></script>
<script type="text/javascript" th:inline="javascript">
    //一般直接写在一个js文件中
    layui.config({
        base:‘/static/common/js/‘
    });
    //这里先use，表示使用 base:‘/static/common/js/‘目录下的demo.js文件

    layui.use([‘form‘,‘layer‘,‘demo‘], function(){
        //layui.key通过key来获取对象
        var $ = layui.jquery,demo=layui.demo;

        $(‘#btnDelete‘).on(‘click‘, function(){

            demo.aaa();

        });


    });
</script>

待注意事项：

• exports(‘demo’, api); //key你懂吧？ 待会在第二步就要用key值来获取var demo这个对象。继而调用对象中函数
• layui.use([demo])表示 ，使用这个模块，也就是咱自定义的js文件。
• 通过layui.key通过key来获取对象var demo=layui.demo;