> 웹 프론트엔드 > 레이이 튜토리얼 > Layui 모듈 사용 사양(코드 포함)

Layui 모듈 사용 사양(코드 포함)

풀어 주다: 2019-11-29 13:23:11
앞으로
2195명이 탐색했습니다.

Layui 모듈 사용 사양(코드 포함)

Pre-loaded

본론으로 바로 들어가겠습니다. 그냥 사용법만 말씀드리는 게 낫습니다. Layui의 모듈 로딩은 핵심적인layui.use(mods, callback) 메소드를 사용합니다. JS가 Layui 모듈을 사용해야 하는 경우 사전 로딩을 사용하는 것이 좋습니다. 이렇게 하면 어디서나layui.use를 작성하는 문제를 피할 수 있습니다. 가장 바깥쪽 레이어에서 다음과 같이 정의해야 합니다.

    /*
    Demo1.js
    使用Layui的form和upload模块
    */
    layui.use(['form', 'upload'], function(){ //如果只加载一个模块,可以不填数组。如:layui.use('form')
    var form = layui.form() //获取form模块
    ,upload = layui.upload; //获取upload模块
    //监听提交按钮
    form.on('submit(test)', function(data){
    console.log(data);
    });
    //实例化一个上传控件
    upload({
    url: '上传接口url'
    ,success: function(data){
    console.log(data);
    }
    })
    });
로그인 후 복사

Loading on Demand(권장하지 않음)

강박 장애가 있고 웹 사이트 성능에 대해 극단적인 요구 사항이 있는 경우에는 원하지 않습니다. 필요한 모듈을 미리 로드하지만 작업이 트리거될 때만 모듈이 로드되므로 이는 허용됩니다. JS의 가장 바깥쪽 레이어에 큰layui.use를 래핑할 필요는 없습니다. 다음만 필요합니다.

*
Demo2.js
按需加载一个Layui模块
*/
//……
//你的各种JS代码什么的
//……
//下面是在一个事件回调里去加载一个Layui模块
button.addEventListener('click', function(){
layui.use('laytpl', function(laytpl){ //温馨提示:多次调用use并不会重复加载laytpl.js,Layui内部有做模块cache处理。
var html = laytpl('').render({});
console.log(html);
});
});
로그인 후 복사

모듈 네임스페이스

Layui의 모든 모듈은layui 객체 아래에 내부적으로layui에 의해 바인딩됩니다. 정의( ) 메소드를 완료합니다. 각 모듈은 고유한 이름을 가지며 점유될 수 없습니다. 따라서 모듈을 호출할 때layui.mod를 삭제하지 않는 한, 모듈 공간이 오염되는 것에 대해 걱정할 필요가 없으며,layui 객체의 할당도 사용해야 합니다. 예:

layui.use(['layer', 'laypage', 'laydate'], function(){
var layer = layui.layer //获得layer模块
,laypage = layui.laypage //获得laypage模块
,laydate = layui.laydate; //获得laydate模块
//使用模块
});
로그인 후 복사

layui에 대한 더 많은 지식을 알고 싶다면 layui 사용법 튜토리얼 칼럼을 주목하세요.

위 내용은 Layui 모듈 사용 사양(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿